Container of information used as teasers for further content.
All components are built upon the CodyHouse Framework.
This component includes variations. All variations share the same SCSS/JS code. They only differ in the HTML part.
The card component is a container of information (e.g., preview image, title and description) used as teasers for further content. It's generally displayed in a gallery of related items.
To prevent the content "jump" caused by the image being loaded, you can apply the
.card__img--no-jump class to the
<figure> element. In SCSS, make sure the padding-bottom value is equal to the image ratio (height/width*100).
Bug Report & Feedback
Get in touch: suggest a component or report a bug.