Question

I have some html that looks like this:

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

A space is rendered after 398 because there is a line-break in the html. For reasons I won’t go into, this line-break cannot be removed. Is there a way to stop a space being rendered there?

Answer 1

No. It is not possible using CSS. Although you can use float, but it doesn’t work out here.

But I have a crappy idea, give this CSS (Ideal Case):

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

But the practical case was like this:

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

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

The ‘ex’ unit is defined by the font’s ‘x-height’. The x-height is so called because it is often equal to the height of the lowercase "x". However, an ‘ex’ is defined even for fonts that don’t contain an "x".

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