A media object has been described as “an image to the left, with descriptive content to the right”, like you see on Facebook, Twitter, & many other websites. To make things a bit more complex, the object on the left doesn’t have to be an image, & the content on the right doesn’t have to be text. But that’s the basic idea.
Media Objects are coming in Bootstrap 4.
To create media objects, you need to be familiar with the following:
- Flexbox (from CSS Layout: Boxes, Displays, & Positioning)
:first-of-type(from CSS Building Blocks: Selectors):first-child(from CSS Building Blocks: Selectors):nth-child(from CSS Building Blocks: Selectors)@mediarules (from Media-Specific Styles: Same HTML, Different CSS)