css – Bootstrap输入的父容器的完全100%宽度?

前端之家收集整理的这篇文章主要介绍了css – Bootstrap输入的父容器的完全100%宽度?前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
如何使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.

这张票提供了各种解决方案,但我正在寻找最好的方法 – 最好是一个CSS类已经提供的Bootstrap。

解决方法

应用输入块级类对我来说非常适合,跨越不同的屏幕宽度。它由 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”建议的风格非常相似。

猜你在找的CSS相关文章