@Agnik7
Posted
Hi, Congratulations on completing this challenge!!!🎉🎉🎉🎉 I have a few suggestions which might help you.
-
Replace the
h2
tag withh1
tag to fix the accessibility issue. -
For
.boxContent
, instead of defining width, define the max-width to make the card responsive.
Replace
.boxContent{
width: 320px
}
With
.boxContent{
max-width: 320px
}
-
By defining the height, you are making the height of the card constant. This means that even if there was no text, the card would take up that much height, thus wasting the space. By not defining height, the height of the card remains variable, i.e. , it can change depending upon the content inside of the card.
-
Try using relative units like rem and em instead of absolute units like px. This helps in better responsiveness, as px value remains constant throughout, and rem and em change according to the screen size. To know more, click here.
Hope this comment helps you in your journey.
Have a nice day!!