CSS3 Transition-Delay

In another round of CSS3 experimentation, I wanted to see if it was possible to sequentially transition the opacity of 3 or more elements via CSS without having them all begin fading at once. While it seems painfully obvious now, I wasn’t aware that the transition-delay property existed. It’s currently compatible with webkit browsers like […]

CSS Word-Wrap: Force Text to Wrap

A rarely used but extremely useful CSS property, the word-wrap. You can force long unbroken text to wrap in a new line by specifying break-word with the word-wrap property. For example, you can use it to prevent text extending out the box and breaking the layout. This commonly happens when you have a long URL […]

The Little Known font-size-adjust CSS3 Property

Ever wanted to use fallback fonts on your CSS with different aspect ratios without them looking huge or tiny? The sparkling new CSS3 font-size-adjust property could do just that, maybe…

Purely CSS – Faking Different Color Columns

We want to create a layout with two columns, each a different color, yet have both colors extend the the edge of the browser. This is a technique intended for people that want a multi-colored column fixed width eg. 960px layout. The secret behind this technique is an 3000 pixel width background image don’t worry […]

CSS Opacity: A Comprehensive Reference

CSS opacity has been a bit of a trendy technique for a few years now, and it’s been especially frustrating for developers trying to implement opacity (also referred to as CSS transparency) in a cross-browser fashion, because it’s taken a while for the different browsers to finally agree on settings. There is still not a […]

Screencast: Understanding CSS3 Gradients

Creating an image only for the purpose of displaying a gradient is inflexible, and is quickly becoming a bad practice. Unfortunately, at the time of this writing, they very well might still be required, but hopefully not for much longer. Thanks to Firefox and Safari/Chrome, we can now create powerful gradients with minimal effort. In […]

CSS3 In Transition

With the addition of the CSS3 transition property comes a lot of uncharted territory. Never before has it been so easy to bring animation into a usable, standards-based browsing environment. Determining how often and to what degree one should use animation on a web build can be tricky. As we evaluate how to implement animations […]

CSS for the iPad

The iPad is coming and the developers already received the iPhone Simulator Extension. The new XCode beta also includes Safari Mobile. If you want to use a CSS modification for the iPad as I do, this is how you tell the iPad to use an additional CSS file…

How to Create Inset Typography with CSS3

In this tutorial, we’ll create inset type, a popular text treatment, using CSS. If you follow Six Revisions closely, you’re probably thinking: "Jacob already wrote a Photoshop tutorial on how to do that." That is correct, but this time we are going to do it using only CSS…

CSS Font Shorthand Property Cheat Sheet

In the past I’ve displayed some serious animosity towards the CSS font shorthand property. I still don’t agree with ever using font shorthand, I do think it’s important that CSS developers understand how it works. I’ve prepared a printable cheat sheet that you can download and hang next to your computer, which will come in […]

Next Page »