html - Bootstrap 响应式按钮大小

Question

我正在使用 Bootstrap，并且 div 中的三个按钮的宽度会根据它们的屏幕尺寸做出响应。目前我只是对按钮应用固定宽度，以便它们即使在最小的屏幕上也能保持一排。这意味着桌面和大型平板电脑上的按钮很小，左右间距很大。如何使按钮根据屏幕尺寸增大和缩小？谢谢

<div class="card-footer">
<a href="#" class="btn btn-primary float-left">Btn1</a>
<a href="#" class="btn btn-primary">Btn2</a>
<a href="#" class="btn btn-primary float-right">Btn3</a>
</div>

标签： htmlcsstwitter-bootstrap

Answer 1

添加.nowrap{white-space: nowrap;}到您的 CSS

添加nowrap到这一行

<div class="card-footer nowrap">
//
</div>

见小提琴：https ://jsfiddle.net/DIRTY_SMITH/rvm49wfa/4/