Question

The text have a big space in the bottom here: http://jsfiddle.net/qHaFR/

And I am not able to remove it.

Can you tell me how to do it?

Answer 1

The wrapper, in this case <span> needs to be a block element with width and height defined. You’ll also need to change the line-height to match the height of the container.

So your style would look like:

#foo {
   background-color:yellow;
   font-size:260px;
   border:1px solid black;
   width: 190px; /* if display: block; */
   line-height: 200px;
   display: block; /* or inline-block */
}

Just to clarify, were you trying to wrap A in an element such as <div> or <h1> you shouldn’t need to declare it display: block because div and h1 are already block.