我想并排设置复选框以直观地表示某些内容。它在我的网站上看起来不错,但在尝试调整大小时或在 iPad 上却分崩离析。我可能犯了一个愚蠢的错误,但我将不胜感激对我的代码的任何更正。
http://www.bootply.com/1a5yzjMAGp
<div class="col-md-6">
<div class="col md-6">
<div class="checkbox checkbox-primary">
<input id="checkbox1" type="checkbox" disabled="disabled" />
<label for="checkbox1">
Art
</label>
</div>
<div class="checkbox checkbox-success">
<input id="checkbox1" type="checkbox" disabled="disabled" checked="checked" />
<label for="checkbox2">
Drama
</label>
</div>
<div class="checkbox checkbox-success">
<input id="checkbox1" type="checkbox" disabled="disabled" checked="checked" />
<label for="checkbox3">
Foods and Nutrition
</label>
</div>
<div class="checkbox checkbox-success">
<input id="checkbox1" type="checkbox" disabled="disabled" checked="checked" />
<label for="checkbox4">
Geography
</label>
</div>
<div class="checkbox checkbox-success">
<input id="checkbox1" type="checkbox" disabled="disabled" checked="checked" />
<label for="checkbox5">
Industrial Arts/Shop Programs
</label>
</div>
</div>
</div>
<div class="col md-6">
<div class="checkbox checkbox-success">
<input id="checkbox1" type="checkbox" disabled="disabled" />
<label for="checkbox6">
Math
</label>
</div>
<div class="checkbox checkbox-success">
<input id="checkbox1" type="checkbox" disabled="disabled" />
<label for="checkbox6">
Music
</label>
</div>
<div class="checkbox checkbox-success">
<input id="checkbox1" type="checkbox" disabled="disabled" checked="checked" />
<label for="checkbox6">
Technology
</label>
</div>
<div class="checkbox checkbox-success">
<input id="checkbox1" type="checkbox" disabled="disabled" />
<label for="checkbox6">
Science
</label>
</div>
<div class="checkbox checkbox-success">
<input id="checkbox1" type="checkbox" disabled="disabled" />
<label for="checkbox6">
Physical Education/Health
</label>
</div>
</div>
最佳答案
您可以尝试为 checkbox
类的 div 赋予以下属性:
.checkbox {
width:250px;
float:left;
}
您可以调整宽度以使其适合您的需要。 这是 fiddle :JSBIN
关于html - 使用 Bootstrap 并排响应式设置复选框,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33018218/