Design comparison
Solution retrospective
Helpful reviews are welcome guys π
Community feedback
- @sulemaan7070Posted almost 2 years ago
hey adr99π, great job on completing the challenge... here are a few suggestions to make your site better..
1.On the desktop version: between the
.info
div and.hero_img
div.. there is much more spacing than the design..2.You can use the
line-height
property on the.info -> p tag
to make it design accurate..3You can use the picture element here, here you can shift between 2 images and the best part is you can include the media query within the element, and also using the
picture
element is considered as a best practice .<picture> <source media="(min-width: 650px)" srcset="img_food.jpg"> <source media="(min-width: 465px)" srcset="img_car.jpg"> <img src="img_girl.jpg"> </picture>
more about picture element hereπ
Hope that helps, happy codingπ₯π―ππ»
Marked as helpful0
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