3-Column Card Component

Community feedback

• 

  Ricky•470

  @pyaetheiNPosted over 2 years ago

  Hello! It took me a while to find out the problem,

  I will explain step by step:

  • remove height: 50%; max-height: 50rem; min-height: 40rem;" from your ".cards" class in style.css because of your height properties , it doesn't work in mobile screen
  • remove overflow: scroll; because it's ugly and add padding: 5rem 0; in your ".cards" class in responsive.css to have spaces between top and bottom of the page

  That's the solution for your problem you're pretty much good to go after doing these steps.

  Things you forgot to add:

  • change card titles font-family
  • add border-radius on first and third card
  • add line-height in your ".card-paragraph"

  In my humble opinion, I recommend you to avoid using heights too much. It isn't required in every layout, it automatically wraps up the content inside it.

  1

  ---

  

  Tran Mai Nhung•110

  @PuppychanPosted over 2 years ago

  @pyaetheiN thank you very much! Your feedback has helped me a lot.

  1

  

  Ricky•470

  @pyaetheiNPosted over 2 years ago

  @Puppychan Glad I could help 😁

  1