3 Column preview card - responsive, flexbox

Community feedback

• 

  hitmorecode•6,680

  @hitmorecodePosted over 1 year ago

  Congratulations well done. I took a look at you CSS and I think I found the problem. After playing with your CSS I found out that the max-height in the main was messing up everything. Try these changes and see for yourself

  main {
  display: flex;
  flex-direction: row;
  margin: auto;
  max-width: 58rem;
  /*     max-height: 27rem; */ ## you can remove this line
  }
  
  
  
      
  @media (max-width: 1024px) {
  ## remove these
  /*     body {  
  height: 90.8rem;
  } */
  
  main {
  flex-direction: column;
  /* justify-content: space-between; */ ## remove this
  /* align-items: center; */ ## remove this
  max-width: 20rem;
  min-height: 58rem; ## change this line
  padding: 50px 0; ## add this
  }
  

  Marked as helpful

  1

  ---

  

  Unkookerinho•460

  @UnkookerinhoPosted over 1 year ago

  @hitmorecode Thank you for your feedback! It works and looks better now! I deleted "min-height: 58rem;" entirely because it was basically useless. You were right about max-height of the body messing up everything - thank you for your answer once again :)

  0

  

  hitmorecode•6,680

  @hitmorecodePosted over 1 year ago

  @Unkookerinho anytime 👍 glad I could help

  0