Design comparison
Solution retrospective
Hi everyone !!
It's my first time using @media queries for responsive. I use Flexbox to improve this skill. If you have any suggestions, it would be a pleasure to know it !! thank you in advance !
Happy coding !
Best regards ! Yous Ben
Community feedback
- @Tuason066Posted over 2 years ago
Hi, I have a suggestion for your styling.
I noticed that your elements have the same style and you write it repeatedly. If your elements have the same styles you can write like this:
.irene-roberts, .anne-wallace { styles... }
so you don't need to repeat the styles over and over.
and if they have only different margins you can write like this:
.irene-roberts, .anne-wallace { same styles... } .irene-roberts { margin-top: 1rem; } .anne-wallace { margin-top: 2rem; }
I also noticed that you wrote your margins like this:
margin-bottom: 0; margin-left: 1rem; margin-top: 1.2rem;
there is a shorthand property for that you can write it like this:
margin: 1.rem 0 0 1rem;
check out this link for more information: https://www.w3schools.com/css/css_margin.asp
By the way, the output is very significant. Happy coding !
Marked as helpful0 - @yousra10Posted over 2 years ago
Hi Jeffrey!
Thank you very much for your suggestions!! It's really help me and I will apply it. Thank you so much !!
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