@DebabrataBanik
Posted
Your design looks great, but it seems you're not using media queries much. Instead of absolute dimensions, consider using relative values. For the .container__card element, use width: 90% and max-width: 24rem. For the buttons, set the width to 80% of the parent element instead of fixed values. Also, apply a different color for the hover state. This approach works, but there’s still room for further improvement.
Marked as helpful
@ivan-josef
Posted
@DebabrataBanik thank you very mutch, in my last challenge I managed to understand why relative lengths are better than absolute lengths
@ivan-josef
Posted
@DebabrataBanik if i can ask one thing, why use max-width instead of just width
@DebabrataBanik
Posted
@ivan-josef Width sets a fixed width, meaning the element will always maintain that exact width, which can cause issues on smaller screens when the viewport size decreases. Max-width, on the other hand, allows the element to take up to a certain maximum width, enabling it to shrink when the viewport size decreases, making the design more flexible and responsive. This also works the other way around, ensuring the element doesn't get too wide on larger screens.
Marked as helpful