Media objects

The media object helps build complex and repetitive components where some media is positioned alongside content that doesn’t wrap around said media. Plus, it does this with only two required classes thanks to flexbox.

Basic example
Generic placeholder image

Media heading

Cras sit amet nibh libero, in gravida nulla.
Nulla vel metus scelerisque ante sollicitudin commodo.
Cras purus odio, vestibulum in vulputate at, tempus viverra turpis.
Middle
Generic placeholder image

Media heading

Cras sit amet nibh libero, in gravida nulla.
Nulla vel metus scelerisque ante sollicitudin commodo.
Cras purus odio, vestibulum in vulputate at, tempus viverra turpis.
Bottom
Generic placeholder image

Media heading

Cras sit amet nibh libero, in gravida nulla.
Nulla vel metus scelerisque ante sollicitudin commodo.
Cras purus odio, vestibulum in vulputate at, tempus viverra turpis.
Right

Media heading

Cras sit amet nibh libero, in gravida nulla.
Nulla vel metus scelerisque ante sollicitudin commodo.
Cras purus odio, vestibulum in vulputate at, tempus viverra turpis.
Generic placeholder image
List
  • Generic placeholder image

    Media heading

    A short sentence to save some space in the code sample

  • Generic placeholder image

    Media heading

    A short sentence to save some space in the code sample

Nested
Generic placeholder image

Media heading

Cras sit amet nibh libero, in gravida nulla.
Generic placeholder image

Nested media heading

Cras sit amet nibh libero, in gravida nulla.