Flex box

Community feedback

• 

  Mansour•220

  @Mansour0007Posted almost 3 years ago

  Thank you, it was very helpful i spent some time trying to put the card in the middle your tip helped me cheers

  1
• 

  PhoenixDev22•16,950

  @PhoenixDev22Posted almost 3 years ago

  Hello Mansour ,

  Well done on your first challenge! I would suggest to modify the styling for body and the .container.

   body {
  
    width: 100%;/* it's % or vw */
  
    min-height: 100vh;
  
    background-color: var(--Dark-cyan);
  
    background-image: url(/images/bg-pattern-top.svg),
      url(/images/bg-pattern-bottom.svg);
  
    background-repeat: no-repeat;
  
    background-position: right 52vw bottom 35vh, left 48vw top 52vh;
  
  /*no need to use position flexbox will center the card  in the middle*/
  }
  
  .container {
  
    display: flex;
  
    justify-content: center;
  
    align-items: center;
  
    width: 100%;
  
    min-height: 100vh;
  
  }```
  
  I really hope this feedback helps.
  

  0