Design comparison
Solution retrospective
It was hard for me to make the header responsive for desktop since I used the mobile first approach. that's all, any advice is appreciated.
Community feedback
- @sulemaan7070Posted almost 2 years ago
hey Yassine Boukhla😄, congratulations on completing the challenge here are a few things you can do to make your site look better and make your code cleaner...
- the images that you have used seem to be squeezed you can do something like to tackle that problem
img { object-fit:contain; }
2.you can use the picture element as a best practice which can change
img
based onmedia query
<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>
3.the drop-down elements like
features
are not working you can add that functionality... 4.you can use theline-height
for thep element
to give space between the lines let me know if you need any help happy coding🔥🔥Marked as helpful0@yassineboukhlaPosted almost 2 years ago@sulemaan7070 Thank you for the review, the drop-down is actually working, you just need to click on the arrow down icon.
1@sulemaan7070Posted almost 2 years ago@yassineboukhla ohh yes..It is working but from the point of user-experience ... they mostly click will on the whole thing...
Marked as helpful0@yassineboukhlaPosted almost 2 years ago@sulemaan7070 Right, will do some changes to it, thanks
0
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