当前位置: 首页 > 面试题库 >

如何在Twitter Bootstrap 3中将按钮居中?

袁恩
2023-03-14
问题内容

我正在Twitter Bootstrap中构建表单,但是将按钮居中于表单输入下方时出现问题。我已经尝试过将center- block类应用于按钮,但这没有用。我该如何解决?

这是我的代码。

<!-- Button -->
<div class="form-group">
    <label class="col-md-4 control-label" for="singlebutton"></label>
    <div class="col-md-4">
        <button id="singlebutton" name="singlebutton" class="btn btn-primary center-block">
            Next Step!
        </button>
    </div>
</div>

问题答案:

用“文本中心”类在div中包装Button。

只需更改此:

<!-- wrong -->
<div class="col-md-4 center-block">
    <button id="singlebutton" name="singlebutton" class="btn btn-primary center-block">Next Step!</button>
</div>

对此:

<!-- correct -->
<div class="col-md-4 text-center"> 
    <button id="singlebutton" name="singlebutton" class="btn btn-primary">Next Step!</button> 
</div>

编辑

作为 BootstrapV4center-block滴入#19102赞成m-*-auto



 类似资料:
  • 问题内容: 我有一个宽度为100%的div。 我想将按钮居中放置,该怎么办? 问题答案: 更新的答案 由于我注意到这是一个积极的答案,所以进行了更新,但是Flexbox现在是正确的方法。 现场演示 垂直和水平对齐。 只是水平的(只要主伸缩轴是水平的,这是默认值) 使用固定宽度且没有flexbox的原始答案 如果原始海报想要垂直和居中对齐,则对于固定按钮的宽度和高度非常容易,请尝试以下操作 CSS

  • 我不知道如何在材质UI中居中放置按钮。这是我的代码: 我怎样才能使我的按钮居中?

  • 不知道如何将此按钮居中。在BS3中,我只使用中心块,但在BS4中,这不是一个选项。有什么建议吗?

  • 下面给出的是我使用材料ui编码的代码。我对那个地区还是新手。我需要把我的按钮放在中间。但它到了拐角处。我的代码有问题吗?

  • 我试图得到分页从材料UI,但我想中心的箭头和页数的按钮。 我试图通过创建

  • 我想绘制以按钮为中心的缩放SVGPath节点。按钮应该保持其大小与图像大小无关,SVGPaths应该保留它们的相对位置。 问题是按钮图像被移位了。