Skip to content
Submitted about 2 months ago

CSS Grid, Flexbox

Eugen•100
@Fender60
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

What challenges did you encounter, and how did you overcome them?

I did this project without a layout for figma, so there were problems with indents and dimensions.

Community feedback

  • Eddie Bones•220
    @EddieBones1Posted about 2 months ago

    Nice work! I was looking at your code, and I noticed a few things:

    • Include a full CSS reset which goes at the top of your style sheet, before your body. A full css reset establishes a consistent design across different browsers by removing any default styling that each browser has.
    //Full CSS Reset
*,
*:before,
*:after {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}
body {}
    • You use the same media screen multiple times in your style sheet. Just use it once, and input all your code in that one media screen.
    Marked as helpful
    0
    Eugen•100
    @Fender60Posted about 2 months ago

    Thank you for your feedback, it's really useful for me. Next time I'll try to do it.

    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