form-actions class similar design in twitter bootstrap 3

Question

We upgraded to twitter bootstrap 3 (from 2.3.2) and used .form-horizontal forms with the buttons inside .form-actions class in various places. We searched for similar design or alternatives in the new version to no avail.

If there isnt any option whats the new recomended way of putting two or more buttons (in the same line) at the end of an horizontal form?

Answer 1

The .form-action is removed in bootstrap 3. and you can use a form-group to add the buttons at the end of the form.

You can add more buttons to form-group in the same line:

<div class="form-group">
        <div class="col-sm-offset-2 col-sm-10"> 
            <input type="submit" class="btn btn-default btn-lg" value="Save" >
            <input type="submit" class="btn btn-default btn-lg" value="Update" >
        </div>
    </div>

If you want to have some color effect or background color for the buttons, you must consider that the form-group has a left and right margin of -15px.

<div style="background-color: black; margin-left: 0px; margin-right: 0px;" class="form-group">

Please see Bootstrap 3 form and form last row background color