Выравнивание изображения и текста по вертикали внутри элемента TD

Мне нужно отобразить значок расширения в td, когда я это делаю, текст и изображение не выравниваются. Я использовал spacer.gif(1x1), через который я вызываю значок расширения. Если я укажу ширину и высоту непосредственно в тексте тега img, он также не будет выравниваться.

Кроме того, я использовал spacer.gif, потому что я могу легко вызвать любой значок, который я хочу, или для td, где нет значка расширения, я могу просто указать ширину, чтобы он хорошо сочетался со всеми другими td.

<td><img src="../images/spacer.gif" class="texpand_icon"/>Actuals</td>

.texpand_icon{background:url('../images/plus.gif') no-repeat left center; padding-left: 16px;}

Кто-нибудь может решить эту проблему?


image html html-table text-alignment
person Ravi    schedule 13.09.2011    source источник

Ответы (1)


arrow_upward
0
arrow_downward

Вы пробовали использовать атрибут valign?

<td valign="middle"><img /></td>

Это должно выровнять само изображение. Чтобы текст выровнялся с изображением, вы можете использовать свойство CSS vertical-align для изображения:

.texpand_icon{
    vertical-align: middle;
    ...
 }
person Chris Bosco    schedule 13.09.2011