I had difficulties with the responsive of the site, especially the mobile version. I didn't know if i only had to do with 375px width screen or all the width screen from 1440px to 375px. I finally decided to do it from 1440 to 375px.
Do you have any advice for me for my future challenges for the responsive? Especially on the screen sizes that i must focus on, or websites that can help me to improve it.
Thanks !
@mandriva19
Posted
Good solution. layout looks good, only between 500-700px there's glitch https://i.imgur.com/v2P9OAY.jpg
regarding screen sizes, that's the thing with responsive design - you have to make it look nice on all common viewports. if you are provided with mobile/desktop mockups only, you're going to have to craft middle ground (tablets, mid-screens) yourself. generally is a good practice.
@good luck~
@kennylun123
Posted
Congratulation on completing the challenge! It's always good to finish the mobile version first then work on the desktop or tablet version using media query. Also I saw that two of the flex item are reversed in between 500px ~ 700px width.
@media screen and (max-width: 700px) and (min-width: 500px)
.newsletter-container {
flex-direction: column; // Delete this should work. **
justify-content: center;
}
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
