Как выровнять текст в блоке по вертикали?

12 3
Р
На сайте с 07.02.2013
Offline
178
1612

Есть блок с высотой 100px:


<div><p>Текст</p></div>

Текст в блоке появляется случайным образом из списка. Текста в списке произвольной длинны. Как выровнять текст по вертикали?

[Удален]
#1

есть такой атрибут как vertical-align, только у меня почему-то работает через раз:)

MacDack
На сайте с 23.07.2012
Offline
55
#2
ultonic:
есть такой атрибут как vertical-align, только у меня почему-то работает через раз:)

Там нужны заданные размеры родителя.

И использовать vertical-align: middle;

Можно таблицу использовать так же.

---

Вот еще статья по теме на хабре

CMS DLE (/ru/users/992868) icq:6три4девять924семь7
Оптимизайка
На сайте с 11.03.2012
Offline
396
#3


<div style="height:100px; display:table-cell; vertical-align:middle;">
<p>Текст</p>
</div>
⭐ BotGuard (https://botguard.net) ⭐ — защита вашего сайта от вредоносных ботов, воровства контента, клонирования, спама и хакерских атак!
[Удален]
#4
MacDack:

Можно таблицу использовать так же.

да, кстати, можете таблицей сделать:

<TABLE height="100">
<TR valign="middle">
<TD><div><p>Текст</p></div></TD>
</TR>
</TABLE>

вариантов масса:)

Дмитрий Удимов
На сайте с 05.05.2010
Offline
274
#5

valign вроде для этих целей есть

Топвизор — аккредитованный регистратор доменов .ru и .рф (https://topvisor.com/ru/domain-registration/) — честная цена 299 руб. за регистрацию и продление.
MC
На сайте с 03.05.2013
Offline
51
#6
ultonic:
есть такой атрибут как vertical-align, только у меня почему-то работает через раз:)

нет такого аттрибута

есть valign

и есть свойства css text-align

bestseekers.com (https://bestseekers.com/)
O
На сайте с 29.05.2008
Offline
195
#7

Matt Cutts, и есть CSS свойство vertical-align :) .

Имхо, нужно обойтись только vertical-align + фиксированная height (вам уже дали ссылку на статью). Лучше без таблиц, а если уж оформлять как display: table-cells, то нужно и сам HTML написать по всем правилам, то-есть, с table>tbody>tr>td.

Anamnado
На сайте с 08.02.2010
Offline
242
#8

line-height: высота блока в пикселях (но для текста в одну строчку это)

O
На сайте с 29.05.2008
Offline
195
#9

Anamnado, line-height это свойство для текста, а не для блока.

Anamnado
На сайте с 08.02.2010
Offline
242
#10

ой ды

<div><p>Текст</p></div>

#div p {

line-height

....

}

задачу видеть нужно .....

12 3

Авторизуйтесь или зарегистрируйтесь, чтобы оставить комментарий