РЕДАКТИРОВАТЬ: просто хотел уточнить, что эти промежутки имеют неизвестную высоту (из-за отзывчивости)!
Я пытаюсь вертикально выровнять два <div class="span6">
внутри <div class="row">
в Bootstrap, и у меня возникают проблемы с использованием любых моих обычных трюков, таких как display: inline-block;
или display: table-cell;
(здесь JSFiddle я работал on: http://jsfiddle.net/mA6Za/).
Вот что я пытался использовать, который не работает в Bootstrap:
<div class="container">
<div class="row" style="display: table">
<div class="span6" style="height: 300px; background: red; display: table-cell !important; vertical-align: middle;">
Block 1 - Vertically center me please!
</div>
<div class="span6" style="height: 170px; background: blue; display: table-cell !important; vertical-align: middle;">
Block 2- Center me too
</div>
</div>
</diV>
Можно ли вертикально выровнять эти два .span6
таким образом, что высота Block1
и Block2
неизвестна? Я бы хотел использовать Bootstrap из-за ответственных функций, но для планшета + мы хотели бы, чтобы контент был вертикально выровнен.