Gap between 2 lines in table cell when image inserted - XHTML/CSS

I have a 开发者_如何学运维table created in XTMl, and I have two lines in table cell, for example:

Firstname
Surname

In the same cell I would like to place the image on the right. When I insert it like <img> I get gap between two lines like this:

Firstname

Surname

Often the image is placed under second line. Why is that happening, and what I should do to prevent it ?

<td><strong>Name<br />Lastname<a href="google.com"><img src="images/1.gif" alt="img" /></a></strong></td>

Try adding the css style "white-space:nowrap;" to the td.

In the image style try adding "float:right" to the image.

The image element is an inline-block element, which means that it's a block that is part of the inline content. When you put the image tag in there, it's part of the second line of text. The second line will get high enough to hold the height of the image, that is causing the space between the texts.

You can take the image out of the inline content by making it a block element, and you can place it to the right by floating it.

Put the image tag first in the cell, and add the CSS style float:right; to it. By making it a floating element you also automatically make it a block element.