Design comparison
SolutionDesign
Solution retrospective
my 2 problems are: i couldnt center the line through price. i couldnt change the image when we switch to phone view i tried to do the <picture> tag with source but i was so confused and it didnt work so i left it like this
thank you all for your help
Community feedback
- @DavidMorgadePosted about 2 years ago
Hello Moscow, congrats on finishing the challenge! pretty good job getting the solutions
If you dont mind, I will try to fix the two things that are bothering you.
- First of all, if you want to center both prizes, use flex con the parent element, in this case is the
p
(I would recommend you to set a div in this type of clases), add a class to thep
and do:
display: flex; align-items: center; <---- centering vertically
- Your Github repository is not working for me!, but I manually guessed where the image was, try using this snippet for the
<picture>
tag, it works perfectly for me:
<picture> <source media="(min-width:768px)" srcset="./images/image-product-desktop.jpg"> <img src="./images/image-product-mobile.jpg" alt=""> </picture>
Hope my feedback helps you!, if you have any questions, don't hesitate to ask, I will try to help you as much as I can
Marked as helpful0 - First of all, if you want to center both prizes, use flex con the parent element, in this case is the
Please log in to post a comment
Log in with GitHubJoin our Discord community
Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!
Join our Discord