我有这个非常简单的代码使用Bootstrap 3:
<html> <body> <main class="container" role="main"> <form class="simple_form form-horizontal"> <div class="form-group text required campaign_url"> <label class="text required control-label" for="campaign_url"><abbr title="required">*</abbr> Url</label> <textarea class="text required form-control" name="campaign[url]" id="campaign_url"></textarea> </div>
它看起来像这样:
注意标签和投入是否粘在左边.检查那些元素我发现这个:
.form-horizontal .form-group { margin-left: -15px; margin-right: -15px; }
为什么在那里?我知道删除它是微不足道的,但它让我想知道我使用Bootstrap的方式是错误的.我该怎么用?
解决方法
它正在发生,因为你使用的是form-horizontal,这意味着与col-*一起被用作布局.从Bootstrap文档:
Use Bootstrap’s predefined grid classes to align labels and groups of form controls in a horizontal layout by adding .form-horizontal to the form (which doesn’t have to be a ). Doing so changes .form-groups to behave as grid rows,so no need for .row.
所以如果你简单地删除形状水平的负边距消失.
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。