Responsive Landing Page using CSS Grid and Flexbox

Community feedback

• 

  Lucas 👾•104,340

  @correlucasPosted over 2 years ago

  👾Hello Victor Okpukpan, congratulations for your new solution!

  Answering your question:

  To fix your background the mobile version use these properties: background-size: contain; / background-repeat: no-repeat;

  Here's the changes I did to your code:

  @media only screen and (max-width: 768px)
  body {
      width: 100%;
      height: auto;
      padding-bottom: 10px;
      background: url(./images/bg-mobile.svg), var(--background-color);
      background-position: center;
      background-repeat: none;
      background-size: contain;
      background-repeat: no-repeat;
  }
  

  👋 I hope this helps you and happy coding!

  Marked as helpful

  0