The outline property in CSS is more or less unknown. The first reason I think is because it only supported on Gecko based browser, even if it is part on the CSS 2 specifications. But you know standards…

It is a shame because it is an interesting property.

What outline does:

It is a bit like border, you specify a width, a style and a color. The shortcut is :

outline: width style color;

The difference with border are:

• you can’t specify a side, it’s everything or nothing
• outline is not taking into account in the box model calculation. You can use the width you want it wont affect the layout around.
• instead of a color you can choose the value “invert” witch invert the color behind the outline

The reason I wanted to talk about border is because I am using it in the styleswitcher I am developing at the moment and I think the combination between a 600px width invert color outline and an overflow:hidden on the container do some pretty nice effect.

But I keep it for later, when it will be ready.