With css3, it is possible to have left / right padding in the interval iff not empty

Question

has a range that may or may not have text content.

Is there a way to have left and right padding if and only if there is text content?

I thought about using the: first and: last pseudo-classes, seeing how some css3 examples make the first character large, for example, large.

will it work or is it a dream dream?

Answer 1

There is a pseudo-selector :empty that will do what you need.

 span { padding:0 20px; } span:empty { padding:0; } 

More details here http://www.w3.org/TR/css3-selectors/#empty-pseudo

Answer 2

You can use css: empty pseudo-class, but, as you might have guessed, it works in everything except IE. But, apparently, IE 9 beta supports it.

Documentation:

http://www.w3.org/TR/css3-selectors/#empty-pseudo

browser support:

http://www.quirksmode.org/css/contents.html#t32

Answer 3

There is a css: empty pseudo tag, but it can be unreliable in IE (suprise ...).

See here for more details: https://developer.mozilla.org/en/CSS/:empty

If your text was in its own container (for example, the <p> ), you can simply target it and apply the add-on to it.