Skip to content
Submitted over 3 years ago

VS Code, Chrome, Stack Overflow, Favicon Generator

Craig•10
@CraigCodez
Preview site (opens in new tab)View code (opens in new tab)
This is a solution for...Four card feature section
  • HTML
  • CSS
1newbie

Design comparison

SolutionDesign

Solution retrospective

Hello,

I'm struggling with how the page responds to the web page being reduced. I think it may be down to my use of PX vs REM/EM/% but confirmation of this would be appreciated.

This is my fist attempt at building a feature page without a tutorial on Udemy or Youtube. Any feedback on how I should continue/ progress my learning is appreciated also!

Thanks

Community feedback

  • Yasmina S•110
    @yvsminvsPosted over 3 years ago

    Hi Craig!

    Congratulations on your first attempt, it looks pretty good!! You can also try to do it for desktop using media queries and, in this case, CSS Grid :)

    I checked your code and I'd suggest you to remove the width and the height assigned to these boxes. Instead, use min-width and min-height.

    When you assign a determined width/height you are fixing these values. That's why when you reduce the page, the boxes don't ''shrink''.

    Hope it helps you!

    0
    Craig•10
    @CraigCodezPosted over 3 years ago

    @yvsminvs Thank you for the feedback, it's very much appreciated!

    I'll start looking more at CSS grid and min-width min-height for now then :D

    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