Как в bootstrap 2.3.2 выровнять span, c высотой 100px, по центру вертикали row, с высотой 400px

Question

[Владимир Маврин]

Есть код:

<div id="title">
		<div class="container">
			<div class="row">
				<div class="span6">
					<p><img src="img/logo.png"></p>  <!-- высота картинки 100px --> 
				</div>
				<div class="span6">
					<h1>Привет Мир!</h1>
					<p>Я рад вас видеть!</p>
				</div>
			</div>
		</div>
	</div>

#title {
  background:#ccc;
  height:400px;
}

Сейчас картинка и текст отображаются сверху блока #title, поскольку занимают не все 400px, а только max 100px.
Как выровнять текст и картинку по середине высоты #title?


1. Есть ли для этого готовые стили в bootstrap?
2. Желательно что бы работала адаптивность и код в итоге получился валидный. Как грамотней сделать?

Answer 1

[Yago]

#title {
   display: table-cell;
   vertical-align: middle;
}

Comments

[Владимир Маврин]

только теперь блок не по центру по горизонтали

[Владимир Маврин]

сделал, блоку выше указал
{
margin: 0 auto;
display: table;
}
Спасибо!

[Владимир Маврин]

Пытался так же выровнять Привет Мир! в span6 (его высота из-за картинки 200px например), но не получилось.
line-height тоже пытался применить, не получилось, из-за того что там 2 строки, между ними растет расстояние, но они не по центру все равно.
Осталось только сделать marin (