Skip to content
Submitted over 3 years ago

stats preview card component using css float

Babatunde Owolabi•80
@nottundeednut
Preview site (opens in new tab)View code (opens in new tab)
This is a solution for...Stats preview card component
  • HTML
  • CSS
1newbie

Design comparison

SolutionDesign

Solution retrospective

This is my first ever project attempt without any tutorial. Any feedback would be appreciated for better solution, especially for the moble layout and the side image filter.

Community feedback

  • Grace•31,270
    @grace-snowPosted over 3 years ago

    This looks really broken for me I’m afraid.

    I advise you remove floats, style with classes not IDs, use a heading element and add a max width media query for the mobile styles at whatever width the desktop layout no longer fits.

    And on your next challenge, style the mobile design first. It’s much easier and your css will be shorter and more performant

    Good luck

    Marked as helpful
    0
    Grace•31,270
    @grace-snowPosted over 3 years ago

    For the image colour, read up on blend modes

    Marked as helpful
    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