使按钮去全宽?

我想要一个按钮占据整个栏宽，但是有困难…

<div class="span9 btn-block">
    <button class="btn btn-large btn-block btn-primary" type="button">Block level button</button>
</div>

如何使按钮与列一样宽?

当前回答

<div class="col-md-9">
    <button class="btn btn-block btn-primary" type="button">Block level button</button>
</div>

在Bootstrap 3中，这应该是您所需要的全部内容。我相信btn-large覆盖了btn-block的宽度。

2014-03-06 11:53:46

其他回答

<div class="col-md-9">
    <button class="btn btn-block btn-primary" type="button">Block level button</button>
</div>

在Bootstrap 3中，这应该是您所需要的全部内容。我相信btn-large覆盖了btn-block的宽度。

2014-03-06 11:53:46

为什么不使用Bootstrap预定义的类输入块级别来完成这项工作呢?

<a href="#" class="btn input-block-level">Full-Width Button</a> <!-- BS2 -->
<a href="#" class="btn form-control">Full-Width Button</a> <!-- BS3 -->

<!-- And let's join both for BS# :) -->
<a href="#" class="btn input-block-level form-control">Full-Width Button</a>

在控制大小^部分了解更多信息。

2013-07-16 23:51:00

您应该将这些样式添加到CSS表中

div .no-padding {
  padding:0;
}

button .full-width{
  width:100%;
  //display:block; //only if you're having issues
}

然后更改将类添加到代码中

<div class="span9 btn-block no-padding">
    <button class="btn btn-large btn-block btn-primary full-width" type="button">Block level button</button>
</div>

我还没有测试过这个，我不确定你想要什么，但我认为这将使你接近。

2012-08-21 19:14:18

我本以为这是最具自助风格的做事方式:

<button type='button' class='btn btn-success col-xs-12'> First buttton baby </button>

我所做的只是将类col-xs-12添加到按钮。

2014-04-03 13:26:46

在Bootstrap 5中，类btn-block不再工作。但是，您可以将类w-100添加到按钮中，使其与容器一样宽。

2021-02-26 15:16:40

使按钮去全宽?

推荐文章

最新文章

标签