Есть ли способ выровнять текст по центру со всех позиций, а не по умолчанию сверху вниз с помощью CSS?

Question

посмотрите на мой код.

http://jsfiddle.net/Q8V4H/6/

Текст в элементе p Phone Dialer выравнивается по принципу сверху вниз, в то время как я хочу выровнять его по центру со всех позиций i, e вверху справа внизу и слева. Вот пример вывода, который производит мой код.

Мне не нужен пробел, вместо этого текст Download PC Dialer должен быть выровнен по центру деления, то есть слева, справа, сверху, снизу, а не только слева и справа.

вот пример изображения того, чего я хочу достичь.

если я использую text-align:center, он будет выравнивать текст только по центру слева и справа, а не сверху и снизу, и в этом случае я также хочу выровнять его сверху и снизу. как мне это сделать?

спасибо

Answer 1

<div style="display:table">
  <div style="display:table-row">
    <div style="display:table-cell;text-align:center;vertical-align:middle;padding:8px">
      Download PC Dialer
    </div>
  </div>
  <div style="display:table-row">
    <div style="display:table-cell;text-align:center">
      <a href="/download"><img src="download.png"></a>
    </div>
  </div>
</div>

Это даст вам такое же поведение, как если бы вы использовали таблицу без семантических проблем фактического использования таблицы.Работает во всех браузерах, кроме IE7 и ниже.

Answer 2

Для выравнивания horziontal вы можете использовать поле: 0 auto; на фиксированный элемент div. Для вертикального выравнивания вы можете установить высоту строки равной размеру шрифта.

Answer 3

Поместите его в <div>, а затем поместите в другое <div>.У дочернего элемента div должно быть vertical-align: middle и line-height: Xpx, где X - высота внутреннего элемента div.

Смотрите здесь: http://phrogz.net/css/vertical-align/index.html