HTML <p> and <span> questions

Question

Hi,

How can I force the following HTML code:

<p><span></span></p>

.. to use vertical space? if the span has a character, or a space, the vertical space is occupied.

Any way to do it with CSS?

Answer 1

You could do:

p span { display: block; height: 1em; }

However, you should put a class on that span, so it doesn't affect everything else.

EDIT: inline-block would probably be better.

Answer 2

You can set min-height on the paragraph:

p { min-height:1.3em; }

However, IE6 does not support the min-height property... I don't have older versions of IE here, so I cannot test this but in modern browsers min-height works just fine. The value 1.3em represents the height of one line of text.