css Audio - Active file-generic CSS - Active Generic - Active HTML - Active JS - Active SVG - Active Text - Active file-generic Video - Active header Love html icon-new-collection icon-person icon-team numbered-list123 pop-out spinner split-screen star tv
CodePen probably won't work great in this browser. We generally only support the major desktop browsers like Chrome, Firefox, Safari, and Edge. Use this one at your own risk! If you're looking to test things, try looking at Pens/Projects in Debug View.

Posts tagged oocss

Contextual heading sizes with Sass

Sass maps make it possible to create congruous, contextual CSS. As an example, let's look at heading sizes.

I try to keep the font-size differences in my headings uniform, i.e.:

  h1 { font-size:...

Design Patterns and Objects with LESS

There's no shortage of posts about preprocessors, and more specifically about LESS. Now that I've been working with preprocessors for a few years now, I feel good about sharing the features...

Introducing The Clip Object

Want to jump straight to the demo? Check it out here.


Have you ever had an issue with your users uploading images in any aspect ratio they like? You have an intended aspect ratio in mind, but...

Think BEM is too ugly? Intoducing BEM-lite

Most CSS developers are probably aware of BEM (Block, Element, Modifier) syntax and its benefit of producing maintainable, object-oriented styles. But many of those CSS developers don't like...