Formal writing styles usually call for paragraphs to be indented. It is rarely seen on the web, though. This is due to the fact that HTML code ignores the tab key, which is commonly used to indent paragraphs in offline word processors.

Indentations vary depending on usage. Books almost always indent every paragraph. Magazines mix it up. On the internet, you will almost always see “block paragraphs” used. These are simply paragraphs without indentation. They substitute the formatting with an extra line between paragraphs.

Block paragraphs are conducive to internet reading, which tends to be in small chunks. This is also the case in memos and business letters, which frequently use block paragraphs. However, formatting choices are up to the author. You must simply provide a mechanism to separate paragraphs visually.

If you prefer to use indentation, then you might be wondering how far you should indent your paragraphs. An indent is normally 5 spaces. To accomplish this with CSS, you can either specify a px width or an em width.

Indentation examples

Here are 2 examples of indenting paragraphs that use a common 12 pixel font-size.

Both indent the same amount and achieve an approximate 5 space indentation. You can use whichever one you prefer.

.content p { text-indent: 25px; }
.content p { text-indent: 2.1em; }

Notice that the examples above don’t apply to all paragraph tags (only p tags inside of the class ‘content’). Make sure you match up the class names to match those of your own content section.