Как выровнять изображения по вертикали в <td>

Question

Я получил <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>

Answer 1

Вам необходимо установить вертикальное выравнивание на самих изображениях.

<style>
td img { 
  vertical-align: top;
}
</style>

Answer 2

добавить 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>

Answer 3

Это сделало работу за меня:

#logo-table td img, #logo-table td
{
    vertical-align: middle;
}

В html:

 <table id="logo-table">
      <!--table contents with imgs-->
 </table>

Answer 4

Если вы дадите класс своему <img class="tops">, тогда CSS

.tops {
   vertical-align: top;
}

свяжет верхний край изображений с верхом ячейки таблицы.

Answer 5

попробуйте это ..

<td cellpadding="0" valign="top">
  <img width="85" src=".../xyz.png" style="display:inline;"/>
  <img src=".../icon_live.gif" style="display:inline;" />
</td>