Welcome to WebmasterWorld Guest from

Forum Moderators: not2easy

Message Too Old, No Replies

How do I reduce line spacing?

And space under headings?



7:04 am on Aug 31, 2007 (gmt 0)

5+ Year Member

My webpage relies heavily on CSS.
The lines are too far apart. The spaces under the titles are too wide. How can I reduce line spacing in the CSS?



9:52 am on Aug 31, 2007 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member

You can specify the margins and/or padding on all sides of an element, example h1{margin:10px 0 5px 0; padding: 2px} or specify line height, i.e. p {font-size: .85em; line-height: 1em}. Play with the line heights to achieve the desired affect. You can also do word spacing: p { word-spacing: 10px; } and letter spacing: p { letter-spacing: 3px; } as additional options.



4:17 pm on Aug 31, 2007 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member

I assume you are displaying an in-line style Hx header in a larger font than the remainder of the text. If so somewhere there has to be a <br> or a <p> to force a new line. Then most browsers will drop to a new line based on the previous font-height which can give a lot of space under the header.

If you put the header in a separate div the browser will only drop down to the next available pixel.

(<div><h1>blah blah</hi></div>text blah blah blah...

Crude, but it works.


2:29 am on Sep 1, 2007 (gmt 0)

5+ Year Member

Thanks guys. I think Marshall's solution is closest to what suits me. Thanks again.

Featured Threads

Hot Threads This Week

Hot Threads This Month