Skip to content
Submitted over 2 years ago

Responsive landing page with css flex

Squashim•350
@Squashim
Preview site (opens in new tab)View code (opens in new tab)
This is a solution for...Product preview card component
  • HTML
  • CSS
1newbie

Design comparison

SolutionDesign

Solution retrospective

The most difficult thing was making the image and it's parent container responsive. My question is how to improve the responsiveness of my website. What are best practises for adjusting height, width with max-width, min-height etc. Thanks for your feedback.

Community feedback

  • Fatlind Shehu•2,230
    @fatlindshehuPosted over 2 years ago

    Hi Squashim, Overall you did a good job, here are some things I think you might check:

    1. "description-container" has no background ( it should have #fff) also the size is not set properly, 2. Try using flexbox properly in the main container and set the image and the description container both 50% of width!
    2. Remove margin-right from 'img-container'!
    3. In order to space the elements between the description container, give the container an overall margin from all sides.
    Marked as helpful
    1
    Squashim•350
    @SquashimPosted over 2 years ago

    @fatlindshehu Thank you for your feedback, I fixed these things and now my site looks so much better!

    0
    Fatlind Shehu•2,230
    @fatlindshehuPosted over 2 years ago

    @Squashim It looks great indeed, keep up the good work!

    0

Please log in to post a comment

Log in with GitHub

Join 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