romila• 3,570
@romila2003
Posted
Hi Unzila,
Congratulations for 🎉 for completing this challenge. I can tell that you put a lot of effort into this. The cards are responsive, and it is great that they are responsive. There are some issues I want to address:
- It is best practice to wrap the main content within the
maintag which would ensure that your content is wrapped within the correct landmarks e.g.<main class="container"></main> - The code is missing the
<!DOCTYPE html>tag at the top. - To center the card in the middle for desktop, you can use the
flexproperty for the body e.g.
body (min-width: 700px) {
display: flex;
align-items: center;
justify-content: center;
min-height: 100vh;
flex-direction: column;
}
Also, I've noticed that you took a desktop-first approach. I would strongly suggest you taking the mobile-first approach as it will be easier for responsiveness and rearranging/changing the elements within the page therefore instead of using the max-width for your media query, you can use the min-width instead.
Overall, great attempt and wish you the best for your future projects so keep coding 👍.
Marked as helpful
0
Unzila Maqsood• 60
@Unzila02
Posted
@romila2003 thank I update and also adopt the suggestions.
1
