twitter-bootstrap 按钮垂直对齐引导程序
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/18949860/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
button vertical align bootstrap
提问by user2568768
I'm trying to align a button in a simple form..
我正在尝试以简单的形式对齐按钮..
I did this:
我这样做了：
<div class="panel panel-default">
<div class="panel-heading">teste</div>
<div class="panel-body">
<div class="row">
<div class="col-lg-6" style="padding-right:20px; border-right: 1px solid #ccc;">
<label class="form-control"> Teste</label>
<input type="button" class="form-control btn-danger" value="example" /><br/>
<input type="button" class="form-control btn-danger" value="example" /><br/>
<input type="button" class="form-control btn-danger" value="example" /><br/>
<input type="button" class="form-control btn-danger" value="example" /><br/>
</div>
<div class="col-lg-6" style="margin:0 auto;" >
<input type="button" value="bot?o" />
</div>
</div>
</div>
</div>
but I want this button to be centered as shown in the following image:
但我希望此按钮居中，如下图所示：
how can i do that? i used "style="margin:0 auto;" on div but didn't work..
我怎样才能做到这一点？我在 div 上使用了 "style="margin:0 auto;" 但没有用。
回答by Itay
I've made you an example of a possible solution. It may need some extra work but it shows the general idea.
我已经为你提供了一个可能的解决方案的例子。它可能需要一些额外的工作，但它显示了总体思路。
I've added a new class called vertical-containerfor this demo.
我为这个演示添加了一个名为vertical-container的新类。
.vertical-container .row {
display: table;
width: 100%;
}
.vertical-container .row > .col-lg-6 {
display: table-cell;
vertical-align: middle;
/* float: none; ~~~~~ Use this setting if needed */
}
