CSS Floats 101

The float property is a valuable and powerful asset to any web designer/developer working with HTML and CSS. Tragically, it can also cause frustration and confusion if you don’t fully understand how it works. Also, in the past, it’s been linked to some pretty nasty browser bugs so it’s normal to get nervous about using […]

My New Best Friend: CSS Generated Content

I’ve become obsessed with generated content lately. In an effort to use fewer and fewer images, I’ve started to use generated content more since more browsers support it IE8+, FF3+, Safari 4+, Chrome 4+. The following are a couple of examples I have built for a project to streamline my pages…

The Font-Face Rule and Useful Web Font Tricks

The possibility of embedding any font you like into websites via @font-face is an additional stylistic device which promises to abolish the monotony of the usual system fonts. It surely would be all too easy if there was only one Web font format out there. Instead, there’s quite a variety, as you will get to […]

CSS3 Buttons – Simple CSS3 framework for creating GitHub style buttons

CSS3 Buttons is a simple framework for creating good-looking GitHub style button links…

CSS Specific for Internet Explorer

As much as we don’t like to deal with the IE bugs, we still have to face it because your boss and visitors are still using Explorer. It gets frustrating when different versions of Explorer displays web pages differently due to the inconsistent rendering engine. We typically use IE conditional comments to fix the IE […]

3D Ribbon Generator

A handy online tool to generate cross-browser compatible CSS ribbons. You can start with the examples and modify the values to get the ribbon you need…

Pure CSS3 Post Tags

This is a rather simple pure CSS trick you can use to style your blog post tags, usually placed at the bottom of the posts. Pure CSS post tags uses at least 2 CSS tricks such as CSS triangles and CSS circles…

An all CSS button

A few years ago I gave a talk about why a button made a great place to bring in type from a branding element such as a logo. My point was that if the type in your logo was an image, and stylish buttons were also often images, then why not align the fonts in […]

The Shapes of CSS

Example page of shapes created with CSS. All use just a single HTML element. Any kind of CSS goes, as long as it’s supported in at least one browser…

Cross-browser CSS gradient buttons

Recently I talked about CSS cross-browser gradients and last week I wrote again about CSS3 gradients. So what I’m going to do today? I will show you how to put the CSS gradient feature in practical use.In this article you will see how you can create a set of gradient buttons just with CSS no […]

« Previous PageNext Page »