Card Layout Demo

6 Card Layout

  • On small screens cards stack vertically and span full container width.
  • On medium sized screens cards span half width.
  • On large screens cards span 1 third width.

5 Card Hero Layout

  • On small screens cards stack vertically and span full container width.
  • On medium sized screens the 1st card spans full width, and the remaining 4 cards span half widths.
  • On large screens the 1st card spans 2 thirds, and the remaining cards span 1 third.

4 Card Layout

  • On small screens cards stack vertically and span full container width.
  • On medium sized screens cards span half width.
  • On large screens cards span quarter widths.

2 Card Layout

  • On small screens cards stack vertically and span full container width.
  • On medium to large sized screens cards span half width.