CODEWITHSUNDEEP
twitter-bootstrapcheckbox
Othmane
Othmane

Reputation: 1124

Divide a form of checkboxes into two or three columns with Bootstrap

I have a form full of Bootstrap checkboxes. However, I want to have it plit into two or three columns, so not to take lots of lines. Here is my code:

<div class="jumbotron">
    {section name=x loop=$records}
            {section name=y loop=$records[x]}
              <div class="checkbox">
                <label>
                    <input type="checkbox" name={$records[x][y].prefkey} {if   $records[x][y].prefval == "on"}checked{/if}>
                    {$records[x][y].prefkey}
                </label>
              </div>
            {/section}
    {/section}
</div>

Please any help !!

Upvotes: 0

Views: 2873

Answers (1)

Nicolai
Nicolai

Reputation: 1953

just wrap your <div class="checkbox"></div> into div with class col-*-4 to get it 3 columns or col-*-6 to get 2 columns.

Reference to docs

JSFiddle Example

UPDATE:

add the following css to avoid problem with jumbotron:

.jumbotron{
    overflow:hidden
}

JSFiddle Example

Upvotes: 1

Related Questions