Skip to content
Submitted almost 3 years ago

3 Column Card Component using Bootstrap

Ty•70
@ItsIchi
Preview site (opens in new tab)View code (opens in new tab)
This is a solution for...3-column preview card component
  • HTML
  • CSS
1newbie

Design comparison

SolutionDesign

Solution retrospective

First time trying Bootstrap on one of these any tips on things I can change to improve would help! Ran into a few issues one) with the width of the columns, couldn't get them as thin as I wanted on desktop. Two) with the active state of the buttons when hovering the bottom of the card would expand slightly. -Thanks

Community feedback

  • Travolgi 🍕•31,400
    @denieldenPosted almost 3 years ago

    Hi Ty, The expansion of the box is caused by the :hover state because the border-width changes. To fix it you have to keep the same border-width thickness in the various states or assign a fixed height to the boxes.

    0

Please log in to post a comment

Log in with GitHub

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord