@VCarames
Posted
Hey, some suggestions to improve you code:
- To give you HTML code structure, you want to set up your code in the following manner (only did parent containers):
<body>
<main>
<article class="card-container”>
</article>
</main>
</body>
The Main Element identifies the main content of the document.
While the Article Element will serve as the card’s container, because the card represents a complete, or self-contained, section of content that is, in principle, independently reusable.
More info:
https://web.dev/learn/html/headings-and-sections/
-
The Alt Tag description for the QR image needs to be improved upon. Its needs to tell screen reader users what it is and where it will take them to when they scan it.
-
Delete the following code; it is unnecessary:
.container {
display: flex;
flex-direction: column;
}
-
Change the
widthof the card tomax-widthto make it responsive. -
Delete the
heightin the image and change thewidthtomax-width: 100%to make it responsive.
Happy Coding! 👻🎃
Marked as helpful
