Skip to content

DEV Community

Alex Carpenter

Posted on Feb 4, 2020 • Originally published at alexcarpenter.me

How to make your own CSS media object pattern

#css

Originally created by Nicole Sullivan back in 2010, the media object is a common web pattern that "could save you hundreds of lines of code".

View the demo on CodePen

Top comments (0)

Subscribe

Read next

How to add a radial gradient around the mouse cursor on the background of a page in Vue.js

Alessandro Rabitti - Dec 2

The CSS I Knew Has Evolved: Advanced Features, New Identity

Abdelrahman Ismail - Dec 2

🚀 Build a Star Rating System with TypeScript & CSS

A0mineTV - Dec 2

Color Palette is served with ShadCn Theme Editor

Giuliano1993 - Dec 2

I am a self taught developer that works best when floating in between design and engineering teams. I enjoy sharing what I know via short instructional screencasts and the occasional written post.

Location

Grand Rapids, MI
Work

UI Engineer
Joined

Dec 13, 2017

How to add gradient overlays to images with CSS

How to use the object-fit CSS property to scale images responsively

How to create skewed backgrounds with CSS