Vanilla HTML CSS Flexbox Variables

Community feedback

• 

  Lucas 👾•104,400

  @correlucasPosted about 2 years ago

  👾Hello SpartanUI, congratulations for your new solution!

  I saw your preview site and everything is nice, I liked the custom bar you've added to the bottom.

  Here's my tips for you:

  1.To make the image and the container responsive replace the width with max-width.

  2.To make the image respecting the container size use max-width: 100% and display: block

  3.Is better you add min-height: 100vh to the body and not to the container, to have more control to give the card alignment:

      display: flex;
      min-height: 100vh;
      justify-content: center;
      align-items: center;
  

  4.You don't really need a div to add the background color, just drop it into the body.

  body { background-color: var(--gray); }

  👋 I hope this helps you and happy coding!

  Marked as helpful

  1

  ---

  

  SpartanUI•245

  @Unal-InanliPosted about 2 years ago

  @correlucas Cheers for the tips lucas, your points about the image is a delight.

  1