Bootstrap 3和简单窗体显示问题与窗体输入

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

我不熟悉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; 
}

来源

2014-02-10 PatrickLightning

通过长你的意思宽度是多少？如果您不希望表单太宽，可以将页面分成若干列，然后将表单放入较小的列中。

<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/

来源

2014-02-10 21:48:10

我绝对不希望它太宽。对不起，我是一个新手 - 这些行将在show.html页面上？ – PatrickLightning

是的，您可以将上述代码中的表单封装到之前您有过表单的任何页面上。我还编辑了答案，以帮助你更多。 –

非常感谢Mlennie。将尝试它。 – PatrickLightning

Bootstrap 3和简单窗体显示问题与窗体输入

回答

相关问题