Vertical Spacing in HTML - dummies

By David Karlins, Doug Sahlin

When working on coding page content in HTML for your web pages, many of you might ask: “How do I get rid of that (vertical) spacing?” between paragraphs. Or, “How do I add (vertical) spacing between list items?”

First, it will be helpful to understand where that vertical spacing comes from. Vertical spacing in HTML is associated with every element. Who decided that every paragraph element should have a line of spacing under it? And who decided that lists should not have spacing between lines?

Every HTML text element, ranging from <h1> to <p> has a default vertical spacing defined above and below it. Just like every heading element has a default font size. And just like, by default, HTML pages have a monochromatic “color” scheme of black and white (plus colors for links).

So how do you change that? CSS. When you create a style sheet for your site, you can change the default vertical spacing associated with any HTML element using the margin property.