Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

Responsive landingpage using flex and @font-face

P

@ghintema

Desktop design screenshot for the Product preview card component coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

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

@DrMESAZIM

Posted

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
Discord logo

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