Design comparison
Community feedback
- @SmithAldumeloPosted almost 2 years ago
hello . you have a very good design but I don't understand the media query you wrote, can you walk me through it?
I like the introduction of js but I feel bootstrap would have been preferable.0@Seif-BasemPosted almost 2 years ago@SmithAldumelo thanks I appreciate that. can you just be more specific about which part of media query you want to learn about.
0@SmithAldumeloPosted almost 2 years ago@Seif-Basem everything honestly ... I don't know how to write media query. I laid my hands on the same challenge and my mobile response was poor. if you can, please check through mine and note my errors with solutions. thank you
0@Seif-BasemPosted almost 2 years ago@SmithAldumelo okay I took a look at your project so I got three things I think they will help you. First thing that we set the media query at three sizes 1200px for big screen, 992px for medium screen and 767px for mobile. what we do is if I used flex box to put two elements in a row. and got to mobile they won't look good so we use media query at 767px to set the direction of flex from row to column. You have a class called "row" try to make under it a media query of max-width:991and type on it flex-direction: column-reverse; it will fix the mobile a little bit. Second thing use Picture element in html it will help you to use two images one for big screens and the other for small ones try to search about it. it is really easy or you can just look at it on my code and you will understand it. honestly I forgot what was the third thing that I wanted to say XD so if I remembered I will tell you.
0@SmithAldumeloPosted almost 2 years ago@Seif-Basem thank you so much, I will work on the corrections and resubmit.
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