3-column preview card component

Community feedback

• 

  Lucas 👾•104,340

  @correlucasPosted over 2 years ago

  👾Hello Finney, congratulations for your new solution!

  Here's my tips for you about the card responsiveness and how to improve it:

  Replace width: 850px; with max-width: 850px; to make it responsive:

  main {
      display: flex;
      margin: 0 auto;
      justify-content: center;
      min-height: 100vh;
      align-items: center;
      max-width: 850px;
      flex-direction: row;
      border-radius: 10px;
      overflow: hidden;
  }
  

  Note that the difference between these two properties is that width is fixed, example, width: 850px is an container that doesn't get bigger or smaller than 850px but max-width: 850px have the maximum of 850px and can contract when the screen scales down and adjust its size.

  👋 I hope this helps you and happy coding!

  Marked as helpful

  1

  ---

  

  Finney•3,030

  @Finney06Posted over 2 years ago

  @correlucas thanks for the feedback.

  0