CodePen

New Pen
User Avatar of Chris Coyier

Chris Coyier

Milwaukee, WI PRO

CodePen's CSS

Inspired by Mark Otto's tour of GitHub's CSS and Ian Feather's tour of Lonely Planet's CSS, I thought I would join the party and talk about how we do CSS at CodePen.

Overview

[1] We use SCSS.

[2] We...

A (Closeable) <noscript> Warning Modal

Here on CodePen we display a modal window (just like the one you just had to close to read this) to users with JavaScript turned off. We like to make it very clear that CodePen isn't a terribly...

Please Don't Learn To Code From Stock Photos

Is that a random document.write in the <head> not in <script> tags? Good luck with that hoss. Nice charset too. Wait. Does that say <script type="text/computert">?


Listen we all...

Some Mini Sass Mixins I Like

There is one block of CSS that I find myself writing all the time. It's this:

position: absolute;top: 0;left: 0;width: 100%;height: 100%;

The ol' cover e-v-e-r-y-t-i-n-g block. That's the kind of...