@romila2003
Posted
Hi Marius,
Congratulations ๐ for completing this challenge, the testimonials look great and is responsive. There are some issues and suggestions I would like to address:
- It is best practice to wrap the main content within the
main
tag which would ensure that your content is wrapped within the correct landmarks e.g.<main class="container"></main>
- I noticed that you used the desktop-first approach however I would strongly suggest you use the mobile-first approach for future projects as it will be easier for responsiveness and rearranging/changing any element/s within your body. Also, it is best practice to follow this approach.
- Instead of using the
padding
andmargin
property to center the cards in desktop, you can use theflex
property on the cards in desktop mode. Also, if you use this approach I would suggest removing theline-height
and reducing thepadding
of the.card
to 30px as this will reduce the size and width of the card to prevent the cards being too big e.g.
@media only screen and (min-width:1200px) {
body {
display: flex;
align-items: center;
justify-content: center;
min-height: 100vh;
flex-direction: column;
}
Overall, great attempt and wish you the best for your future projects so keep coding ๐.
Marked as helpful