Standard .media and modifications

The most basic

The items in this column below are using just the basic .media classes.

Hello mr cat

Media object img.-not-circled

Media object using a .flaticon.stroke.globe-1 instead of an image for .media__img

Aligned right

Hello mr cat

Header combinations

Header level 2

Hello mr cat

Header level 3

Hello mr cat

Header level 4

Hello mr cat

Header level 5

Hello mr cat

Modifications

The examples in this column show .media object tweaks

Large

.-large Hello mr cat

Small

.-small Lorem ipsum dolor sit, lorem ipsum dolot sit

Pull Down

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque feugiat urna ut purus tempus egestas. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Suspendisse scelerisque libero nisl, suscipit

Lorem ipsum dolor sit, lorem ipsum dolot sit

Author

Published

Published 22 November, 2013 by Graham Charlton @ Econsultancy

Graham is the Editor in Chief at Econsultancy. Blogs about ecommerce, mobile commerce, email marketing and more.

You can follow Graham on Twitter, or connect on Google+ and LinkedIn

Align Body Right

Lorem ipsum dolor sit, lorem ipsum dolot sit

Small Red Image

Over 200,000 statistics, insight and analysis on all aspects of digital

Category or type

With a category above the title

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque feugiat urna ut purus tempus egestas. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Suspendisse scelerisque libero nisl, suscipit

Inside a pod

Patterns based on .media

Media Flex

Media object based on the .flexbox inuit implementation giving vertically centered content

Hello mr cat

Media Form

Search form (can be seen in the panels) for a large header and body copy

Find Digital Jobs & apply online today

If you're a digital media professional you will be able to search for jobs and find your ideal career move within digital media, online marketing, PR, social media, mobile, search, web design and technical.

Inside pod

Media Form

If you're a digital media professional you will be able to search for jobs and find your ideal career move within digital media, online marketing, PR, social media, mobile, search, web design and technical.