面板布局内的bootstrap形式看起来不对

Question

如果我在引导程序面板中定义了一个表单,那么表单组布局就会变成碎片.

我将表格涂成红色,以便我可以看到它的位置;)这里是jsFiddle:https://jsfiddle.net/DTcHh/

我发现如果我添加

.panel-body .form-horizontal .form-group {
    margin-right: 25px;
    margin-left: 25px;
}

到了css,然后我得到了这个

(我将表格涂成红色,以便我可以看到它的位置;))

所以它看起来像是固定的,但对我来说似乎是一个可怕的黑客

• 这是bootstrap中的错误
• 我只需要申请这个CSS
• 我的表单定义有问题吗？

谢谢

Answer 1

根据引导文档(http://getbootstrap.com/css/#forms-horizo​​ntal),该类form-horizontal使<form>行为像一个.row,所以你不需要添加它,并有.col-**-*从组,标签和东西英寸 文档给你一个例子o

但你有一个.row内部.row和没有.col-**-*..row有一个负余量来删除他父母的填充,所以没有.col-**-*父母它有2个负边距.

所以它有点混乱.我建议删除你的.row和你的.form-horizontal课程以达到你想要的外观或像你已经做的那样添加边距.

这是一个小提琴.