Horizontal cards
Bootstrap 5 Horizontal cards component
Responsive horizontal cards built with Bootstrap 5. Display content in a sleek, user-friendly layout with intuitive, responsive horizontal cards.
Basic example
Using a combination of grid and utility classes, cards can be made horizontal in a
mobile-friendly and responsive way. In the example below, we remove the grid gutters with
.g-0
and use .col-md-*
classes to make the card horizontal at the
md
breakpoint. Further adjustments may be needed depending on your card content.

Card title
This is a wider card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.
Last updated 3 mins ago