css - Bootstrap 输入的父容器的完美 100% 宽度？

Question

如何使 Bootstrap 输入字段与其父字段一样宽 100%？

正如 steve-obrien 在 Bootstrap Issue #1058 中所写的那样:

Setting to 100% does not work when applied directly to an input field as it does not take in to account the padding. So you end up with 100% of the container plus the padding on the input box, so the input box usually breaks outside its container.

那张票提供了各种解决方案，但我正在寻找最好的方法——最好是 Bootstrap 已经提供的 CSS 类。

Answer 1

应用 input-block-level 类对我来说效果很好，适用于各种屏幕宽度。它由 Bootstrap in mixins.less 定义如下:

// Block level inputs
.input-block-level {
  display: block;
  width: 100%;
  min-height: 28px;        // Make inputs at least the height of their button counterpart
  .box-sizing(border-box); // Makes inputs behave like true block-level elements
}

这与 his comment on issue #1058 中 'assembler' 建议的风格非常相似.