responsive landing page using css flex-box

Community feedback

• 

  Hassia Issah•50,650

  @HassiaiPosted almost 2 years ago

  Give the img a max-width of 100% , mix blend-mode: multiply and opacity 0f 0.7, there is no need to give .desktop and mobile a fixed width and height value. to make each visible declare display: block. e.g :

  img{ 
   max-width:100%;
    mix-blend-mode: multiply
   opacity: 0.7; or opacity: 0.8;
  }
  
   in the mobile design:
  
  .desktop{
    display: none;
   }
  .mobile{
   display: block;
  }
  
  in the desktop design:
  
  .mobile{
  display: none;
  }
  .desktop{
  display:block;
  }
  

  Use rem or em as unit for the padding, margin, width and preferably rem for the font-size for more on CSS units watch this https://youtu.be/N5wpD9Ov_To

  Hope am helpful.

  Well done for completing this challenge. HAPPY CODING

  0