我要对齐按钮(锚按钮风格,但按键同样的情况),垂直居中,但似乎有一点偏移。
I want to align button (anchor with button style, but the same happens with buttons) vertically centered, but there seems to be a little offset.
这是HTML code我用:
This is the html code I use:
<div class="alert alert-info">
Text on the left
<p class="pull-right">
<a class="btn btn-default" href="#">Link</a>
</p>
</div>
这是它的外观中的jsfiddle: http://jsfiddle.net/TeAvH/
This is how it looks in jsfiddle: http://jsfiddle.net/TeAvH/
看来,出现这种情况是因为按钮类有显示:inline-block的
属性。更改为显示:内联
应该可以解决这个问题。
It appears that this happens because the button class has display:inline-block
property. Changing this to display:inline
should fix the issue.
.alert p .btn {
display:inline;
}
这里更新了小提琴。
下面是默认的 .btn
类属性:
.btn {
display: inline-block;
padding: 6px 12px;
margin-bottom: 0;
font-size: 14px;
font-weight: bold;
line-height: 1.428571429;
text-align: center;
white-space: nowrap;
vertical-align: middle;
cursor: pointer;
border: 1px solid transparent;
border-radius: 4px;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
-o-user-select: none;
user-select: none;
}