Melvin Aguilar π§π»βπ»β’ 61,220
@MelvinAguilar
Posted
Hi @hannahvw π, good job on completing this challenge! π
I have some suggestions you might consider to improve your code:
- Use the
<main>
tag to wrap all the main content in your solution rather than<div class="container">
. - Use
<footer>
instead of<div class="attribution">
. The<footer>
element contains authorship information. - Instead of using pixels in font size, use relative units of measure like
rem
orem
. The font size in absolute length units (px) does not allow users with limited vision to change the text size in some browsers. Reference. - To make alternative texts more useful, add descriptive text to the alt attribute of the QR image to explain what the QR image does.
- The container isn't centered correctly. You can use flexbox to center elements:
body {
width: 100%;
min-height: 100vh;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
Links with more information:
- The Complete Guide to Centering in CSS.
- A Complete Guide to Flexbox (CSS-Tricks).
- How TO - Center Elements Vertically (W3Schools).
- CSS Layout - Horizontal & Vertical Align (W3Schools).
I hope those tips will help you! π
Good job, and happy coding! π
Marked as helpful
0