Design comparison
Solution retrospective
What could I have done better?
Community feedback
- @AdrianoEscarabotePosted almost 2 years ago
Hello John, how are you? I truly loved your project's outcome, however I have some advice that I hope you'll find useful:
You have used <br> , using <br> is not only bad practice, it is problematic for people who navigate with the aid of screen reading technology. Screen readers may announce the presence of the element. This can be a confusing and frustrating experience for the person using the screen reader. You can read more in MDN.
If we see how the layout is behaving at higher resolutions, with the help of google dev tools, we will see that it is stretching a lot, to solve this we can use a max-width with the value we want the content to stop growing and to center use a margin: 0 auto;
main { max-width: 1440px; margin: 0 auto; }
The remainder is excellent.
I hope it's useful. 👍
Marked as helpful1 - @Nadine-GreenPosted almost 2 years ago
HEY JOHN!
I love the extra effects you added to it, very nice
One thing you could do is set a
max-width
for the.items
or thep
element inside them, this will prevent the words inside from stretching so much when the viewport is increased.The same goes fo the
p
element in yourheader
IF THIS WAS HELPFUL IN ANY WAY, DON'T HESITATE TO MARK IT AS HELPFUL :)
HAPPY CODING!
Marked as helpful1
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