Remove space added by line break in HTML code (using CSS?)

Question

I have an html that looks like this:

<span> 398 <span>comments posted in</span> </span> 

The space is displayed after 398 because there is a line break in html. For reasons that I will not enter, this line break cannot be deleted. Is there any way to stop the space that is being displayed there?

Answer 1

No. This is not possible with CSS. Although you can use float , but this does not work here.

But I have a crappy idea, give this CSS (perfect case):

 span span {margin-left: -1em;} span span {margin-left: -1ex;} 

But the practical case was this:

 span span {margin-left: -0.4em;} span span {margin-left: -0.7ex;} 

1em or 1ex is the width of the space character in CSS. Hope it works! Everyone knows about em . So something about ex :

The unit ex is determined by the x-height of the fonts. X-height is so called because it is often equal to the height of the lower case "x". However, the ex expression is even defined for fonts that do not contain "x".

Demo: http://jsfiddle.net/UmdfA/

Answer 2

I think we all agree that, if possible, the right solution:

 <span> 398<span>comments posted in</span> </span> 

But you can use some shenanigans to sort ...

 span span { margin-left: -1ex; } 

or

 span span { position: relative; left: -1ex; }