Articles

You’ve heard of “clearing floats”, but do you really understand it? The whole problem is that floated objects do not add to the height of the object …

It can sometimes be useful to have some text be aligned to the left and some text be aligned to the right on the same line. For example, in a footer, where you might want to have copyright info on …

You can always float your images to one side or the other and give them a bit of a margin just by giving them a class like “floatright” and declaring that class as:

.floatright {
float: right;
margin: 5px;
}…

Jason from 37 Signals has a great post up on the Signal vs. Noise blog on how simple print stylesheets can be and still be effective. Basically using display: none; enmasse. People don’t need your header or your footer or …

If you are just getting started with CSS, a great way to begin is by downloading a template and playing around with things and seeing what happens. You have to be careful though, some templates are so overly complicated that …

Tempted to use something like “1800number_box” for a ID? Don’t. Because it won’t work. Class identifiers are allowed to start with a number, but ID identifiers are not.

That is all.

If you have already existing HTML using it …

With browsers that support the CSS3 Spec (Safari only at the time of this writing) there is no longer need for the sliding doors technique to create horizontally expanding elements that utilize background images. The ability to assign multiple background …

You’ve seen this a million times:

<ul>
  <li><a href="#">Home</a></li>
  <li><a href="#">About us</a></li>
  <li><a href="#">Contact us</a></li>
</ul>

The classic menu HTML which you can transform into any number of beautiful things through CSS. You could include that in all your pages …

The 37 Signals Blog, Signal vs. Noise, has a post about a month ago with an interesting observation:
“Designing for the iPhone is like a hybrid of print and web design.”

Their point was with the iPhone, you know the …

The default way to include an external stylesheet is to use the the link tag inside your pages head:

<link rel="stylesheet" href="default.css">

That is a tried and true method and supports the whole spectrum of browsers from old and ancient …

Creating vertically-expanding boxes is easy, just declare a width in your div CSS but no height. The div will expand to as large as it needs to be for the content inside. It gets a little more complicated if you …