开发者

Aligning a image and text vertically within TD element

开发者 https://www.devze.com 2023-04-04 09:42 出处:网络
I need to display a expand icon in td, when I am doing that, text & image are not getting aligned. I have used spacer.gif(1x1) through which I am calling expand icon. If I specify the width &

I need to display a expand icon in td, when I am doing that, text & image are not getting aligned. I have used spacer.gif(1x1) through which I am calling expand icon. If I specify the width & height directly in the img tag text is not getting aligned as well.

Also I have used spacer.gif the reason being I can easily call which ever icon I want or for td's where there is no expand icon I can simply specify width so that it aligns nicely with all other td's.

<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;开发者_运维知识库}

Can someone fix this problem?


Have you tried the valign attribute?

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

That should align the image itself. To get the text to align with the image you can use CSS' property vertical-align on the image:

.texpand_icon{
    vertical-align: middle;
    ...
 }
0

精彩评论

暂无评论...
验证码 换一张
取 消