Текст вертикально-выровненный не работает

Question

Я создаю несколько блоков, где один плавает влево, а другой плавает вправо и то же для текстовых блоков.

Теперь то, что я хочу сделать, это вертикально выровнять текст, но:

display: table-cell; vertical-align:middle; 

Не работает и я не могу использовать высоту строки (так как нет ни одного линия):

line-height: value of div; 

Если кто-то может указать мне в правильном направлении, это было бы здорово. Я создал скрипку:

http://jsfiddle.net/hjHNL/

Answer 1

Вам нужен контейнер, который имеет

display:table 

с настольной ячейки внутри него

http://jsfiddle.net/hjHNL/2/

Answer 2

Попробуйте что-то вроде этого:

div#loading { 
padding-top:200px; 
position: absolute; 
top: 35%; 
left: 45%; 
margin-left: -(Y/2)px; 
margin-top: -(Y/2)px; 
z-index: 1; 
font-family:Arial,Helvetica,sans-serif; 
} 

Вы можете установить «обивка-топ» в любом рх или%, но убедитесь, что положение является абсолютным. Похоже, что вы ищете, чтобы переместить текст рядом с pic вниз для выравнивания. Я использовал приведенный выше код на сайте, предназначенном для друга. Вы можете посмотреть на результаты по адресу:

Showing alignment of divisions text and images inside a division.

Я надеюсь, что это помогает.

Answer 3

Вертикальное выравнивание не нравится, что вы плывете вправо. Поместите div в контейнер и вместо этого поместите этот контейнер.

Answer 4

Самый простой способ я нашел, добавлял это к вашему CSS класс content_case_copy

.content_case_copy{ 
    width:160px; 
position: relative; /*this*/ 
    top: 50%; /*and this*/ 
vertical-align:middle; 

http://jsfiddle.net/hjHNL/3/