1

我有两行或更多行，每行有三个复选框。我希望它们在行之间均匀排列，就像它们在表格列中一样。现在，根据文本标签的长度，它们看起来是交错的。如何模拟每一行的表格列，使布局看起来更有条理？

<form id="form-filter" name="form-filter" method="POST" action="/filter" class="form-inline">
                  <fieldset>
                    <legend style="margin-bottom:-10px;">Select up to 6 filters</legend>
                    <div class="control-group">
                      <div class="controls">
                        <label class="checkbox inline">
                          <input id="Medjugorje" name="Medjugorje" type="checkbox" checked>Medjugorje
                        </label>
                        <label class="checkbox inline">
                          <input id="Kibeho" name="Kibeho" type="checkbox">Kibeho
                        </label>
                        <label class="checkbox inline">
                          <input id="Lourdes" name="Lourdes" type="checkbox">Lourdes
                        </label>
                      </div>
                      <div class="controls">
                        <label class="checkbox inline">
                          <input id="Fatima" name="Fatima" type="checkbox">Fatima
                        </label>
                        <label class="checkbox inline">
                          <input id="Secrets" name="Secrets" type="checkbox">Secrets
                        </label>
                      </div>
                    </div>
                    <button type="submit" class="btn btn-primary">Filter</button>
                    <button id="clearButton" type="button" class="btn">Clear</button>
                  </fieldset>
                </form>
4

2 回答 2

0 
<form id="form-filter" name="form-filter" method="POST" action="/filter">
                  <fieldset>
                    <legend>Select up to 6 filters</legend>
                    <div class="row-fluid">
                      <div class="span12">
                        <label class="checkbox span4">
                          <input id="Medjugorje" name="Medjugorje" type="checkbox" checked>Medjugorje
                        </label>
                        <label class="checkbox span4">
                          <input id="Kibeho" name="Kibeho" type="checkbox">Kibeho
                        </label>
                        <label class="checkbox span4">
                          <input id="Lourdes" name="Lourdes" type="checkbox">Lourdes
                        </label>
                      </div>
                    </div>
                    <div class="row-fluid">
                      <div class="span12">
                        <label class="checkbox span4">
                          <input id="Fatima" name="Fatima" type="checkbox" checked>Fatima
                        </label>
                        <label class="checkbox span4">
                          <input id="Banneux" name="Banneux" type="checkbox">Banneux
                        </label>
                        <label class="checkbox span4">
                          <input id="Beauraing" name="Beauraing" type="checkbox">Beauraing
                        </label>
                      </div>
                    </div>
                    <button type="submit" class="btn btn-primary">Filter</button>
                    <button id="clearButton" type="button" class="btn">Clear</button>
                  </fieldset>
                </form>
于 2013-04-03T14:42:49.317 回答
0 
<form id="form-filter" name="form-filter" method="POST" action="/filter">
    <fieldset>
        <legend>
            Select up to 6 filters
        </legend>
        <div class="row-fluid">
            <div class="span4">

                <label class="checkbox">
                    <input id="Medjugorje" name="Medjugorje" type="checkbox" checked>
                    Medjugorje </label>
                <label class="checkbox">
                    <input id="Kibeho" name="Kibeho" type="checkbox">
                    Kibeho </label>
            </div>
            <div class="span4">

                <label class="checkbox">
                    <input id="Lourdes" name="Lourdes" type="checkbox">
                    Lourdes </label>
                <label class="checkbox">
                    <input id="Fatima" name="Fatima" type="checkbox" checked>
                    Fatima </label>
            </div>
            <div class="span4">

                <label class="checkbox">
                    <input id="Banneux" name="Banneux" type="checkbox">
                    Banneux </label>
                <label class="checkbox">
                    <input id="Beauraing" name="Beauraing" type="checkbox">
                    Beauraing </label>
            </div>
        </div>
        <button type="submit" class="btn btn-primary">
            Filter
        </button>
        <button id="clearButton" type="button" class="btn">
            Clear
        </button>
    </fieldset>
</form>
于 2013-04-03T18:46:20.277 回答