3column preview card component

Community feedback

• 

  pbgo2•60

  @pbgo2Posted about 1 year ago

  Hello SPYDEY7, I think the best option to fix ,tune css class container a bit to allow automatically align columns width -with margin auto

  .container {
    display: flex;
    height: 400px;
    justify-content: center;
    align-content: center;
    //margin-inline: 20%;
    //min-width: 600px;
    margin: 20% auto;
    width: 65vw;
  }
  

  1
• 

  Tony Appiah•160

  @TonyAppiahPosted about 1 year ago

  Hello SPYDEY7,

  Well done for taking your time and effort to complete this challenge.

  Regarding your question, your buttons are not aligned because on the desktop view, column-1 has 3 lines of paragraph text and column-2 and column-3 have 4 lines. As you resize the viewport, you will see that the paragraph text will be realigning accordingly and whenever all 3 columns have the same number of paragraph lines, the buttons are aligned as well.

  You can adjust the width of the columns till you get equal number of paragraph lines. I hope it helps.

  0