Skip to content
Submitted over 2 years ago

Responsive landingpage using flex and @font-face

Harm Intemann•590
@ghintema
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

I had trouble syncronizing the change of layout and the change of the picture. My solution was to put the flex-wrap:wrap behind media-query that also controls the picture.

I am glad for any best-practice advices. Thaks a lot!!

Community feedback

  • IRVINE MESA•1,855
    @DrMESAZIMPosted over 2 years ago

    Hi Harm

    Well done for completing your first challenge that as very good work. Here are my suggestions to make your solution better

    Firstly remove the file "prodoct-preview-card-compontent-main_HaI.html" this is duplication . the file index.html will be enough

    secondly I want us to center the project at the center or middle of the screen we can do that by setting the "wrapper" class properties inside file index.html line 36 to

    .wrapper { display: flex; justify-content: center; height: 100vh; align-items: center; }

    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