CODEWITHSUNDEEP
htmlcsstwitter-bootstrap
Piero
Piero

Reputation: 9273

How put select label on the left in bootstrap

I have this problem:

enter image description here

And this is my code:

<form class="form-horizontal">
    <div class="row">
        <div class="col-sm-2">
            <div class="form-group">
                <label class="control-label">Select list:</label>
                <select class="form-control">
                    <option>1</option>
                    <option>2</option>
                    <option>3</option>
                </select>
            </div>
        </div>
        <div class="col-sm-2">
            <div class="form-group">
                <label class="control-label" style="display: inline-block;">Select list:</label>
                <select class="form-control">
                    <option>1</option>
                    <option>2</option>
                    <option>3</option>
                </select>
            </div>
        </div>
        <div class="col-sm-2">
            <div class="form-group">
                <label class="control-label">Select list:</label>
                <select class="form-control">
                    <option>1</option>
                    <option>2</option>
                    <option>3</option>
                </select>
            </div>
        </div>
        <div class="col-sm-2">
            <div class="form-group">
                <label class="control-label">Select list:</label>
                <select class="form-control">
                    <option>1</option>
                    <option>2</option>
                    <option>3</option>
                </select>
            </div>
        </div>
        <div class="col-sm-4">
            <div class="form-group">
                <button class="btn btn-default">Filtra</button>
            </div>
        </div>
    </div>
    </form>

how can I get the label side by side the select? I have tried with the form-horizontal but doesn't work.

Thanks

Upvotes: 5

Views: 7566

Answers (2)

Vivek Vadoliya
Vivek Vadoliya

Reputation: 81

use form-inline instead of form-horizontal and you can also use this link for your references http://getbootstrap.com/css/#forms

Upvotes: 2

Juha Tauriainen
Juha Tauriainen

Reputation: 1611

Add form-inline class to your <form> tag Like so:

<form class="form-inline">

Upvotes: 1

Related Questions