Как получить альтернативный текст для поддержки вертикального выравнивания: середина? - PullRequest
4 голосов
/ 18 февраля 2010

В следующем тестовом примере альтернативный текст центрируется по горизонтали, но он прикреплен к верхней части окна. Как мне получить его в середине?

<html>
  <body>
    <div style="height: 300px; width: 300px; border: solid black 1px;">
      <img src="asdfasdf" alt="foo" style="display: block; text-align: center; vertical-align: middle"/>
    </div>
  </body>
</html>

Ответы [ 3 ]

4 голосов
/ 18 февраля 2010

Одним из преимуществ таблиц является то, что они обеспечивают кросс-браузерное вертикальное центрирование. DIVs нет. Это однажды тот случай, когда я бы укусил пулю и добавил эти уродливые TR и TD.

<table cellspacing="0" style="width:300px;height:300px;border:1px solid black;">
   <tr>
     <td style="vertical-align:middle;text-align:center;">
       <img src="asdfasdf" alt="foo" />
     </td>
   </tr>
</table>

Он называется одноклеточным центрирующим столом и, как ни страшно, он работает.

1 голос
/ 20 мая 2013

Попробуйте использовать несколько пробелов в начале атрибута alt.Это было единственное, что мне показалось работающим на Chrome.

0 голосов
/ 18 февраля 2010

Попробуйте с display:table-cell вместо block.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...