Question

最近在Rails应用程序上升级到Bootstrap 3。 SimpleForm文本框以及其他表单输入太大 - 它们的长度错误地为整页。该应用程序确实具有响应式设计，表单输入框确实调整大小。我想将表单输入大小限制为50％而不是整页。我确实添加了这个初始化器gist https://gist.github.com/tokenvolt/6599141，但它似乎没有效果。

我不熟悉Bootstrap3 / Simpleform2.1.1冲突。

我在application.css.scss中将宽度调整为50％，但这没有做出干净的改变

/* forms */

input, textarea, select, .uneditable-input {
  border: 1px solid #bbb;
  width: 100%;
  padding: 10px;
  margin-bottom: 15px;
  @include box_sizing;
}

Answer 1

长度是指宽度？如果您不希望表单太宽，可以将页面分成列，然后将表单放入较小的列中。

<div class="row">
  <div class="col-sm-6 col-sm-offset-3">
    <%= simple_form-for...
  </div>
</div>

Bootstrap使用一个将页面分为12列的网格系统。如果您只是打开表单，它将占用所有12列（整个页面），因此您需要指定表单要占用的列数。这是一篇真正帮助我理解新网格系统的帖子：http://blog.jetstrap.com/2013/08/bootstrap-3-grids-explained/

Bootstrap 3和Simple Form显示表单输入问题

1 个答案: