2013-12-13 1 views
0

Я пытаюсь сделать вертикальное выравнивание в моем случае.Как вертикально выравнивать мой тег в моем случае

У меня есть.

<section id='container'> 
    <div id='title'> 
     <h1>Title here.</h1> 
    </div> 
</section> 

У меня есть CSS, как

#title{ 
display: inline-block; 
width: 235px; 
height: 94px; 
position: relative; 
text-align: center; 
} 

#left-lesson-title h1{ 
color:white; 
line-height: 94px; 
vertical-align: middle; 
text-align: left; 
font:normal 1.3em arial; 
margin-left:15px 
} 

Я не могу показаться, чтобы получить h1 тексты по вертикали выравнивается по центру. В моем случае h1 выравнивается с вершиной. Может ли кто-нибудь мне помочь? Благодарю.

ответ

2
#title{ 
    border:1px solid black; 
    display: table-cell; 
    width: 235px; 
    height: 94px; 
    vertical-align:middle; 
    text-align: center; 
} 

http://jsfiddle.net/WC6t8/

Вы должны установить дисплей в табличном-клетки затем установить вертикальное выравнивание в середине.

Это должно быть в родительском контейнере тега h1.

+0

, но мне нужно иметь дисплей как встроенный блок для удовлетворения моих потребностей. – FlyingCat

+0

Попробуйте это, чтобы узнать, будет ли он работать для того, что вам нужно (встроенное блочное решение), предполагая, что вы уже знаете размер контейнера (я добавил границы как визуальный): http://jsfiddle.net/WC6t8/1 / –

Смежные вопросы