Design comparison
Community feedback
- @VCaramesPosted about 2 years ago
Hey @walterfolk, some suggestions to improve you code:
- To make your content semantically correct, you'll want your layout to be like this (only did the main containers:
<body> <main> <article> <article class="sedan-card"></article> <article class="suv-card"></article> <article class="luxury-card"></article> </article> </main> </body>The Article Element is the best choice to wrap the all the cards in and each individual card because they are self-contained and independently reusable; they can be used in different parts of you site or other sites as well.
-
The car images/icons serve no other purpose than to be decorative; They add no value. There Alt Tag should left blank and have an aria-hidden=“true” to hides it from assistive technology.
-
Your CSS Reset is extremely bare. You want to add more to it.
Here are few CSS Resets that you can look at and use to create your own CSS Reset or just copy and paste one that already prebuilt.
https://www.joshwcomeau.com/css/custom-css-reset/
https://meyerweb.com/eric/tools/css/reset/
http://html5doctor.com/html-5-reset-stylesheet/
Happy Coding!
0 - @nemesisaquibPosted about 2 years ago
You have made the design very well, your work is also very good but if you give line-height in <p> tag paragraphs here you know more about line-height then there is more batter look .. keep coding
0
Please log in to post a comment
Log in with GitHub
Join 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