Design comparison
Solution retrospective
I would love some feedback on the HTML structure, naming classes, and the CSS.
Community feedback
- @denieldenPosted over 2 years ago
Hi Xhanti, good job! I took some time to look at your code and have some ideas for improving it:
- remove all unnecessary code, the less you write the better as well as being clearer: for example the
div
container of image - remove all
margin
from.container
class because with flex they are superfluous - use flexbox to the body for center the card
Overall you did well 😉 Hope this help!
Marked as helpful1 - remove all unnecessary code, the less you write the better as well as being clearer: for example the
- @kem522Posted over 2 years ago
Hi! Good work!
I noticed that you set each of these padding values separately:
padding-top: 15px; padding-left: 15px; padding-right: 15px;
This is totally fine and absolutely works but generally I'd expect to see the shorthand version used:
// where the first value is the top padding // the second value is the padding for both left and right // and the last one is for the bottom padding: 15px 15px 0;
You can read more about it here: https://css-tricks.com/almanac/properties/p/padding/
Happy coding!
Marked as helpful1 - @SamadeenPosted over 2 years ago
Hey!! Cheers 🥂 on completing this challenge.. . Here are my suggestions 1.You should use <main class="container"> instead of <div class="container">. 2. Go down orderly when you are using the headings h1 down to h2 down to h3 and so on.
. Regardless you did amazing.. Happy coding!!!
1
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