@ApplePieGiraffe
Posted
Hey there, Lazar Ristic! 👋
Congratulations on completing your first Frontend Mentor challenge! 🎉 Good effort on this one! 👍
I'd like to suggest doing a little more work on the responsive design of the card component. Currently, the card looks pretty good in the desktop and mobile layout, but its size and layout doesn't adjust to accommodate screens with sizes in between those two. You might want to switch to a mobile-friendly layout sooner to prevent a horizontal scroll bar from appearing along the bottom of the page and try allowing the width of the card component to dependent upon the width of the screen in the mobile layout (by adding width: 100% to the card and then giving it a max-width so that it doesn't become too wide). 😉
Hope that small tip helps. 🙂
Keep coding (and happy coding, too)! 😁
@lazza24
Posted
@ApplePieGiraffe Thank You for your feedback, much appreciated. Tried to figure it out, but couldn't. Gonna check it again. Best regards!
@lazza24
Posted
@ApplePieGiraffe don't quite understand what should I do? On card class (.flex-container when i add width: 100) nothing happens. Neither max-width.
@ApplePieGiraffe
Posted
@Lazarr591
Hey!
You'll need to add both properties to an element in order to have them work together. Try something like,
width: 100%;
max-width: 25rem;
...on an element like .flex-container. 😉
