@VCarames
Posted
Hey there! 👋 Welcome to FEM and congrats on completing your first challenge!🎊🍻
Here are some suggestions to help improve your code:
- The
section
element is being used incorrectly ⚠️ and not needed for this challenge .
- Every site should ALWAYS have ✅ a
main
element not only for semantic purposes but also to help assistive technology find the main content of your content. For this challenge, it will serves as the component’s container ⚠️.
More Info: 📚
- It is best practice ✅ to use,
classes
for styling purposes, while usingids
solely for JavaScript.
- The
attribution
should be wrapped ⚠️ in afooter
element.
- To properly center ✅ your content to your page, you will want to add the following to your
body
(this method uses CSS Grid):
body {
min-height: 100vh;
display: grid;
place-content: center;
}
More Info: 📚
- Change ⚠️
width
tomax-width
in your component’s container to make it responsive. You will also want to remove theheight
as it is unnecessary.
- For improved accessibility 📈 for your content, it is best practice ✅ to use
rem
for yourfont-size
and other property values. Using this unit gives users the ability to scale elements up and down, relative to a set value.
If you have any questions or need further clarification, feel free to reach out to me.
Happy Coding! 🤖
Marked as helpful
@Gielth
Posted
@vcarames Hi there!
Thank you for the welcome.
Also, thank you for the feedback, I didn't use the main, 'cause, for incredible as it seems, the course I took on learning both HTML5 and CSS3 didn't said a thing on it, very odd due to it being important, the footer I just didn't think it was needed, I've made the changes to it and gonna submit it again now...
All of your feedback was good and very easy to understand, I'm still new to web development but aiming on improve as much as possible!