Design comparison
Community feedback
- @correlucasPosted about 2 years ago
👾Hello Ahmed Ghanem, Congratulations on completing this challenge!
Great code and great solution! I’ve few suggestions for you that you can consider adding to your code:
1.The colors you’ve used are a little bit different from the original colors. When you download the project files there’s a file called
style-guide.md
where you can find information such asfont-family
,hsl color codes
, device sizes, and thefont-size
for the headings.2.The html markup for this solution its built entirely with
<div>
and you can improve it using semantics tags to describe what its inside each block of content. You can replace the<div>
that wraps each card with<article>
you can wrap the paragraph with the quote with the tag<blockquote>
this way you'll wrap each block of element with the best tag in this situation. Pay attention that<div>
is only a block element without meaning.3.Add the correct size to keep the elements centered and not growing too muc, the container size is
max-width: 1110px
main { max-width: 1110px; width: 90%; height: 90%; }
✌️ I hope this helps you and happy coding!
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