Stats Preview Card Component

Community feedback

• 

  P

  Jake Godsall•1,390

  @jakegodsallPosted 8 months ago

  Hi there 😁

  Great job with this!

  Just a couple of notes on making it more responsive:

  This part's sticking out of the screen, making you scroll to see everything. It's happening because of the set width. A slick way to fix this for a responsive design is to use a percentage for the width and then add a max-width in pixels for how big you want it on a desktop screen.

  .card-container {
      width: 80%;
      max-width: 1110px;
  }
  

  Also, about stuff overflowing, it's usually not a great idea to lock in the height. When you set a fixed height, it won't adjust if your content grows or shrinks. That could mean your content ends up spilling out of its box or disappearing, depending on your overflow setting.

  CSS is pretty smart and can figure out the height based on what's inside. Best to just let it do its thing 😎

  .card-container {
      height: auto; /* this is the default value */
  }
  

  Hope this helps! 😁

  0