div中的中心bootstrap 3按钮工具栏

时间:2014-04-11 04:58:59

标签: html css twitter-bootstrap-3

如何在btn-toolbar div中水平设置一个bootstrap 3 col-lg按钮?

      <div class="col-lg-6 col-sm-3 noleftpad">
          <div class="well topnestedbut">   
              <div class="btn-toolbar nested-top">
                  <button type="button" class="btn btn-default btn-sm"><strong>This must be centered</strong></button>
              </div>
          </div>
      </div>

CSS:

.btn-toolbar.nested-top{
    position:absolute;
    top:0px;
    text-align:center;
}

.well.topnestedbut{
    padding:35px 10px 10px;
}

.noleftpad{
    padding-left:0px;
}

我希望按钮附加到容器div的顶部,并且也居中: enter image description here

1 个答案:

答案 0 :(得分:1)

这就是我的所作所为:

当元素位于绝对位置时,它会浮动在内容之上。在这种状态下,它只会占用与其内部相同的空间。

如果在该元素上设置宽度100%,则它将占据父(或相对)容器宽度的100%。

http://jsfiddle.net/Per3m/3/

.btn-toolbar.nested-top{
    text-align:center;
    position:absolute;
        top:0;
    width:100%;
}