Design comparison
Solution retrospective
Managed to make it work. Not satisfied with using max-width on the main flexbox to keep the width from adapting to the widest child element.
What challenges did you encounter, and how did you overcome them?In my flexbox blog-preview-card the width of the box adapts to the widest child element by default, how do I adapt this width of the flexbox to the width of the img element? So the rest of the child elements need to render within this width?
For now, I used max-width (width of the illustration + padding) on the flexbox. Feel like there's got to be a better way to do it. Not sure though.
What specific areas of your project would you like help with?In my flexbox blog-preview-card the width of the box adapts to the widest child element by default, how do I adapt this width of the flexbox to the width of the img element? So the rest of the child elements need to render within this width?
For now, I used max-width (width of the illustration + padding) on the flexbox. Feel like there's got to be a better way to do it. Not sure though.
Community feedback
- @R3ygoskiPosted 7 months ago
Hello Suhas, congrats for finish your challenge, and your project is very good.
About your doubt, if you box is follow the size of the children element, it's because it's
width
is setted toauto
, so it's expand or retract based on it's children size.If you don't want this happening, you can set a value to your
width
, or even usemin-width
andmax-width
.If something I said was unclear, please, comment below and I will try to help.
0
Please log in to post a comment
Log in with GitHubJoin our Discord community
Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!
Join our Discord