Simple responsive page with Grid element

Community feedback

• 

  darryncodes•6,390

  @darryncodesPosted about 3 years ago

  Hi Ewa,

  Nice solution, pretty much spot on!

  Some interesting info for you:

  • css unit best practice
  • a brief guide on responsive web design

  A couple of tweaks i'd make:

      background: no-repeat url(/Challenge-1/images/pattern-background-desktop.svg) var(--pale-blue); // I've removed center here
      background-size: 100% auto; // I've added this to match the design and to stretch the background across the whole view port
      margin: 0;
      display: flex; // Added Flex and min-height to responsively center your design, you should remove the margin property on your .bubble class too
      justify-content: center;
      align-items: center;
      min-height: 100vh;
  

  Marked as helpful

  1

  ---

  

  Ewa•30

  @em-ewaaPosted about 3 years ago

  @darryncodes I totally forgot about viewport units! I always struggle to make everything centered and responsive. It didn't occur to me to use flexbox on body element but now it seems very clear.

  Thank you for your feedback! I will definitely check the links out 🙂

  0