javascript - 连续 Bootstrap 七列

Question

我正在使用 bootstrap，我需要创建一个包含 7 个 div 的“行”。它是包含七个自定义复选框的一行，一个对应一周中的每一天。这是我正在尝试做的事情的图片。

我看到一个例子显示这是我现在写的:

<div class="container col-md-12">
    <div class="row seven-cols col-md-12">
        <div class="col-md-1">
            <label class="checkbox-inline ggsettimana ggsettimanabox">
                <input type="checkbox" id="inlineCheckbox1" value="option1"> Lunedì
            </label>
        </div>
        <div class="col-md-1">
            <label class="checkbox-inline ggsettimana ggsettimanabox">
                <input type="checkbox" id="inlineCheckbox1" value="option1"> Lunedì
            </label>
        </div>
        <div class="col-md-1">
            <label class="checkbox-inline ggsettimana ggsettimanabox">
                <input type="checkbox" id="inlineCheckbox1" value="option1"> Lunedì
            </label>
        </div>
        <div class="col-md-1">
            <label class="checkbox-inline ggsettimana ggsettimanabox">
                <input type="checkbox" id="inlineCheckbox1" value="option1"> Lunedì
            </label>
        </div>
        <div class="col-md-1">
            <label class="checkbox-inline ggsettimana ggsettimanabox">
                <input type="checkbox" id="inlineCheckbox1" value="option1"> Lunedì
            </label>
        </div>
        <div class="col-md-1">
            <label class="checkbox-inline ggsettimana ggsettimanabox">
                <input type="checkbox" id="inlineCheckbox1" value="option1"> Lunedì
            </label>
        </div>
        <div class="col-md-1">
            <label class="checkbox-inline ggsettimana ggsettimanabox">
                <input type="checkbox" id="inlineCheckbox1" value="option1"> Lunedì
            </label>
        </div>
    </div>
</div>

如何为每个 div 设置相同的大小并将它们全部显示在一列中？

Answer 1

我假设您正在为此尝试使用网格系统。你做不到，因为 7 不等于 12。你可以很容易地自己做 css，给每个 div 一个 10% 的宽度，并给容器左右 15% 的边距。

没有太多细节我帮不上什么忙，但你不必严格遵循网格。 7/5 网格实际上不起作用。 我有一段时间没有使用 bootstrap，但是你能不能让每个 div 1 变宽并居中？这些天我使用粉底，我知道你可以用它。

编辑:找到居中列的示例:http://www.minimit.com/articles/solutions-tutorials/bootstrap-3-responsive-centered-columns