Question

我正在使用Bootstrap，需要将一列垂直对齐到底部。它只是不起作用。有人可以帮忙吗？

HTML：

<div class="container-fluid">
    <div class="row">
    <div class="col-md-8">
    <div><span id='Name' class="response"></span> <span id='Country' class="response"></span></div>
    <div id="vidspace"></div>
    </div><!--end  col-md-8--></!--end>
    <div class="col-md-4 vbottom">
    <table id="personInfo">
    <tr><td>Age:</td><td id='Age' class="response"></td></tr>
    <tr><td>Neighborhood:</td><td id='Neighborhood' class="response"></td></tr>
    <tr><td>Distance from Home:</td><td id='fromHome' class="response"></td></tr>
    <tr><td>Occupation:</td><td id='Occupation' class="response"></td></tr>
    </table>
    </div><!--end  col-md-4--></!--end>
    </div><!--end row --></!--end>
</div>

CSS：

#person_wrapper {
    display: none;
    position: absolute;
    left: 0;
    top: 10%;
    z-index: 10;
    border-radius: 5px;
    background-color: white;
    padding: 20px;

    height: auto;
}

.vbottom {
    display: table-cell!important;
    vertical-align: bottom!important;
}

Answer 1

verticle-align的底部值将元素与底部元素对齐。所以它在技术上已经处于底层。

如果你想把它移到你的窗口，一种方法是：

.vbottom {
    position:relative;
    margin-top:50%;
}

如果你能澄清你想要的东西，我能够给你一个更好的答案。

对齐底部以使引导程序无法正常工作

1 个答案: