Is it possible to create a two columns form with twitter bootstrap? They have some nice examples here: http://twitter.github.com/bootstrap/base-css.html But unfortunately all of them are using one column.
You can add columns and rows by adding <div class="row"> and <div class="col"> to your form. In the example above, the email and password fields are separated into two columns within a row. This is why they are displayed side by side on a webpage.
The simple method to get 8 equal columns is to use the auto-layout columns... Show activity on this post. As BenM said above, Bootstrap uses a 12 column grid system, which won't divide cleanly into 8 equal columns. If you absolutely require 8 columns, it might be worth checking out this, or even rolling your own.
Wrap the form tag around your span divs. This is working for me, but you might need to tweak things a bit:
<div class="row"> <form class="form-horizontal"> <div class="span6"> <fieldset> <legend>Legend text</legend> <div class="control-group"> <label class="control-label" for="input01">Text input</label> <div class="controls"> <input type="text" class="input-xlarge" id="input01"> <p class="help-block">Supporting help text</p> </div> </div> </fieldset> </div> <div class="span6"> <fieldset> <legend>Legend text</legend> <div class="control-group"> <label class="control-label" for="input01">Text input</label> <div class="controls"> <input type="text" class="input-xlarge" id="input01"> <p class="help-block">Supporting help text</p> </div> </div> </fieldset> </div> </form> </div>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With