我得到一個<td>
其中兩個圖像()駐留顯示如下。一個比另一個高得多。我如何讓較短的那個對齊到<td />
的頂部?如何垂直對齊圖像
<td style="padding-left: 0px; cursor: pointer; vertical-align: top;">
<img width="85px" src=".../xyz.png"/>
<img src=".../icon_live.gif" /> // shorter one
</td>
我得到一個<td>
其中兩個圖像()駐留顯示如下。一個比另一個高得多。我如何讓較短的那個對齊到<td />
的頂部?如何垂直對齊圖像
<td style="padding-left: 0px; cursor: pointer; vertical-align: top;">
<img width="85px" src=".../xyz.png"/>
<img src=".../icon_live.gif" /> // shorter one
</td>
如果你給一個類你<img class="tops">
那麼CSS
.tops {
vertical-align: top;
}
將綁定圖像表電池頂部的上邊緣。
您需要在圖像本身上設置垂直對齊。
<style>
td img {
vertical-align: top;
}
</style>
添加align="top"
第一圖像(高大之一)
<td style="padding-left: 0px; cursor: pointer; vertical-align: top;">
<img width="85px" src=".../xyz.png" align="top" />
<img src=".../icon_live.gif" /> // shorter one
</td>
我很肯定你需要將它設置爲較小的一個,而不是較大的一個,如果你只設置其中一個。 – 2010-03-16 14:11:31
試試這個..
<td cellpadding="0" valign="top">
<img width="85" src=".../xyz.png" style="display:inline;"/>
<img src=".../icon_live.gif" style="display:inline;" />
</td>
這爲我做的工作:
#logo-table td img, #logo-table td
{
vertical-align: middle;
}
在html中:
<table id="logo-table">
<!--table contents with imgs-->
</table>
嗯,我現在看到的示例頁面與您的示例代碼有兩種不同之處。 img標籤有'height ='指令,風格被指定爲一個類。我現在正在跨瀏覽器測試... – msw 2010-03-16 05:35:35
糟糕,我的意思是'img'標記屬性。 – msw 2010-03-16 05:37:52