在警报字段中垂直对齐按钮 [英] Align button vertically in alert field
本文介绍了在警报字段中垂直对齐按钮的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我要对齐按钮(锚按钮风格,但按键同样的情况),垂直居中,但似乎有一点偏移。
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;
}
这篇关于在警报字段中垂直对齐按钮的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文