@ApplePieGiraffe
Posted
Hi, Basile Raiwet! š
Good work on this challenge! š Your solution's nearly pixel-perfect for the desktop layout and it responds rather well! š
One or two things I'd like to suggest are,
- Making sure there's always a bit of space between the text and the bottom of the card for the testimonial cards (the text comes quite close to the bottom when the width of the screen decreases in the desktop layout).
- Adding a max-width to the testimonial cards and horizontally centering them in the mobile layout so that they aren't too wide when the layout first changes from desktop to mobile.
Keep coding (and happy coding, too)! š
@BasileRaiwet
Posted
@ApplePieGiraffe Thanks for your advice :)
About your first recommendation, It behaves like that because I had to set the height in pixel because the "fit-content" property doen't work with the screenshot feature (don't know why since this property is supported by every browser except IE)
Thank you for your comment.
Have a nice day
@ApplePieGiraffe
Posted
@BasileRaiwet
NP, Basile! š
Did you perhaps mean min-content
? I believe the screenshots for the design comparison are taken in Firefox and I tried out using height: min-content
in your solution in Firefox and it seems to work fine. š I often find that giving an element a variable height dependant on its content (rather than an explicit height) is easier to work with (and it should allow you to keep that space around the content of the card when the height changes).
@BasileRaiwet
Posted
@ApplePieGiraffe
No, I mean fit-content
š
I often use this property in the same way you use min-content
and it work on firefox and chrome but not here . Anyway, min-content
seems to work in the same way in this use-case. š
@ApplePieGiraffe
Posted
@BasileRaiwet
š