Base Apparel coming soon page challenge

Community feedback

• 

  Lucas 👾•104,340

  @correlucasPosted about 2 years ago

  👾Hello Shady , Congratulations on completing this challenge!

  Here's some tips to improve your solution:

  REMOVE THE MAX-WIDTH: 1440PX TO ALLOW THE CONTENT TO GROW:

  main {
      display: flex;
      /* max-width: 1440px; */
  }
  

  Note that these sizes given in the style-guide.md in the case 1440px for desktop and 375px are only a reference value to say in which dimension the design were created, don't stick to these values because your solution should be fully responsive and fit any screen size.

  Add the background image to the body not the container otherwise the bg will not display it full screen:

  body {
      background-repeat: no-repeat;
      background-image: url(images/bg-pattern-desktop.svg);
      font-family: 'Josefin Sans', sans-serif;
      margin: 0px;
      width: 100%;
      overflow-x: hidden;
      padding: 0px;
      display: flex;
      align-items: center;
      justify-content: center;
      min-height: 100vh;
      flex-direction: column;
  }
  

  ✌️ I hope this helps you and happy coding!

  Marked as helpful

  0
• 

  Laharl•1,000

  @UrbanskiDevPosted about 2 years ago

  Hello Shady Omar !

  Congratulation for finishing this project

  Some suggestions :

  1. In your HTML file, you can change <div class="header"> to an <header>, because a div tag has no special meaning while an header tag have one.

  2. For the mobile responsive part, I would add a min-width:300px to avoid your main component to shrink too much in size when the screen becomes smaller !

  Otherwise, you did a really good job !

  I hope it helps, keep learning and happy coding !

  Marked as helpful

  0