将div垂直居中对齐

Question

As the title says, i have a div that i want to align center vertically. 如标题所示，我有一个div，我想垂直居中对齐。

<body>
<div class="container" id="names_wrapper">
    <div class="row">
        <div class="col-md-4">
            <a href="#">
                <img src="images/feat1" class="img-responsive img-circle">
                <h2 class="text-center">Jammu</h2>
            </a>
        </div>
        <div class="col-md-4">
            <a href="#">
                <img src="images/feat2" class="img-responsive img-circle">
                <h2 class="text-center">Kashmir</h2>
            </a>
        </div>
        <div class="col-md-4">
            <a href="#">
                <img src="images/feat3" class="img-responsive img-circle">
                <h2 class="text-center">Ladakh</h2>
            </a>
        </div>
    </div>
</div>
</body>

i tried to wrap that div in a another div with height of 100% and applied vertical-align: center property but it doesn't work. 我试图将该div包装到另一个高度为100% div中，并应用了vertical-align: center属性，但是它不起作用。

i'm using twitter bootstrap. 我正在使用Twitter Bootstrap。 Whats' the solution? 有什么解决方案？

Answer 1

Assuming that you are trying to center the .row div inside the .container 假设您试图将.row div放在.container内部

.container {
    display:table-cell;
    vertical-align:middle;
}

Hope it will help 希望对你有帮助

将div垂直居中对齐

问题描述

1 个解决方案

解决方案1
0 2014-05-27 08:34:38

将div垂直居中对齐

问题描述

1 个解决方案

解决方案1 0 2014-05-27 08:34:38

解决方案1
0 2014-05-27 08:34:38