Responsive 3 column preview card component

Community feedback

• 

  Isaac Prime•630

  @Isaacayomi

  Posted over 2 years ago

  The container is not responsive yet as it is not looking okay on larger screens. to make it responsive, .container{ display: flex; flex-direction:row; }

  then add other stylings like adjusting the attribution and all. this should help also

  03
• 

  Vikash Maurya•310

  @VikashMaurya10

  Posted over 2 years ago

  Hello there 👋. You did a good job!

  • Hover on Button there is border so height and width increased of whole card. This is not well, you can do this

      background-color: $Very-light-gray;
      padding: 1.1875rem 2rem;
      margin-top: 1.875rem; // 30px;
      border: 2px solid $Very-light-gray;
      outline: none;
      font-weight: 400;
      border-radius: 30px;
      cursor: pointer;
      font-size: 0.8rem;
      transition: background 0.1s ease-in;
  
      &:hover {
          background: transparent;
          color: $Very-light-gray !important;
      }
  }
  

  • To understand better go to my solution maybe you can find it useful click here. I hope you find this helpful.

  01