Bootstrap:按钮中的嵌套标签

时间:2014-11-10 10:37:48

标签: html css twitter-bootstrap

我有一个.label嵌套在.btn中。当我.pull-left .label时,垂直对齐会偏离几个像素(请参阅JSfiddle here):

<div class="container">
    <div class='btn btn-lg btn-primary btn-block'>
        <div class='label label-info pull-left'>BALANCE</div>
        <span>$10.00</span>
    </div>
</div>

如何使标签垂直居中?

1 个答案:

答案 0 :(得分:0)

<强> HTML

<div class="container">
    <div id='balance' class='btn btn-lg btn-primary btn-block'>
        <span class="btn-info">BALANCE</span>
        <span>£<span class='value'>10.00</span></span>
    </div>
</div>

<强> CSS

#balance .btn-info{
  padding:5px;
  border-radius:                    6px;
  -webkit-border-radius:            6px;
  -moz-border-radius:               6px;
}

工作小提琴 http://jsfiddle.net/D2RLR/7477/

或者你可以添加一些类

#balance > div{
   padding-bottom:2px;
}