Responsive landing page using CSS (flexbox and grid).

Community feedback

• 

  Mahdi Ali•180

  @mahdicodes1Posted over 1 year ago

  Hello AlexaVas, How are you?

  I have a tiny tip for your CSS codes. You don't need to rewrite the codes that don't change in the media query section. For example: For the body tag that:

  body {
  background-color: hsl(30, 38%, 92%);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  height: 800px;
  }
  

  I have commented on the codes that don't need to rewrite them:

  @media screen and (max-width: 600px) {
  body {
  /*  You don't need these lines of code. */
  /* background-color: hsl(30, 38%, 92%);
  display: flex;
  align-items: center;
  justify-content: center; */
  
  height: 700px;
  width: 100%;
  margin: 0px;
  }
  

  By eliminating these codes, the size of the CSS file will reduce, the page's performance will improve, and maintaining style codes will be easier. I hope you find it useful!

  Marked as helpful

  0