Design comparison
Solution retrospective
As always, please give any feedback. I got slightly bored and wanted to try something quick and easy to keep my mind busy. Right after submitting, I realized that my code has a container like feel whereas the original design does not. Other than that, are there anything else that you guys can suggest I improve on?
Community feedback
- @mattstuddertPosted almost 5 years ago
Hey Adler, nice work! As you mentioned, the component in the design has its width constrained, whereas your solution stretches. I'd recommend having a go at refining that to get it looking as close to the design as possible.
Here are some other pointers after taking a look at your code:
- You've got
h1
andh3
headings, but noh2
. It's recommended to avoid skipping heading levels as this can lead to accessibility issues with the content hierarchy. - You're using IDs for styling, which I'd recommend against. They're overly specific and they can't be reused on the page. Instead, stick to class, attribute, pseudo, and type selectors. It will help keep your code more maintainable, especially as you start building larger projects.
I hope that helps. Keep up the great work!
1 - You've got
- @just-a-devguyPosted almost 5 years ago
Thanks Matt!! I will work on refining it later today or this weekend. I'm trying to get out of using IDs unless it's for ONE VERY SPECIFIC thing on the page but old habits tend to die hard. I will use first and nth type to format the two sections and see how that works out. My goal for this project was to practice my css selections. Rarely, if ever do I use combinations in my previous projects and the more I look into web dev, the more it seems like that's best practice. I will get on it. Thanks a lot Matt!! :)
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