5

我有一个链接，我想在.well引导框架的类中垂直居中，并btn btn-danger在锚标记上使用该类。这是下面的图片。我尝试使用vertical-align:middle;，但这似乎不起作用。您可以看到井上的空间甚至不在顶部和底部。

在此处输入图像描述

这是HTML：

<div class="well">
   <%= link_to "Remove", thing, method: :delete, style: "font-size: 11px; float:right; ", :class => 'btn btn-danger'%>

</div>
4

2 回答 2

4

看来您不应该（或根本不能）垂直对齐浮动元素。

这是我的建议： 

<div class="well mywell">
    <div class="pull-right myfloater">
       <button class="btn btn-danger vcenter">Remove</button>    
    </div>
    <p><!-- things --></p>
</div>

.mywell{
   height: 150px;
}
.myfloater {
    line-height: 150px;
}
.vcenter{
    vertical-align: middle;
}

现场示例：http: //jsfiddle.net/Sherbrow/wxM5Z/2/

编辑

更好地line-height应用于浮动元素。

于 2012-06-25T08:51:12.333 回答
3

也许这就是你需要的：jsfiddle。

我添加了新类，以免覆盖默认引导程序。

于 2012-06-25T08:03:50.023 回答