Mehdi S.
Mehdi S.

Reputation: 471

align 2 input field with a dropdown bootstrap

This is what I have now, I try multiple method including from but none of them worked for me.

What I have: enter image description here

What I want: enter image description here

My code:

<link href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet"/>
<fieldset class="inline-fields">
    <div class = "row col-sm-12">
        <div class = "row col-sm-6 col-md-6">
        	<div class="dropdown">
				<button class="btn btn-default btn-lg dropdown-toggle" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">Designer
				<span class="glyphicon glyphicon-triangle-bottom"></span></button>
				<ul class="dropdown-menu scrollable-menu" role="menu">
					<li><a href="#">Action</a></li>
					<li><a href="#">Another action</a></li>
					<li><a href="#">Something else here</a></li>
					<li><a href="#">Action</a></li>
					<li><a href="#">Action</a></li>
					<li><a href="#">Another action</a></li>
        		</ul>
			</div>
        </div>
        <div class = "row col-sm-6 col-md-6">
			<input type="text" class="form-control form_after input-lg" id="form1" placeholder="email"/>
			<input type="text" class="form-control form_after input-lg" id="form2" placeholder="referal"/>
            <br/>
        </div>
    </div>
</fieldset>

Thank you.

Upvotes: 0

Views: 231

Answers (1)

li0n_za
li0n_za

Reputation: 455

Add display: inline-block; to your <div class="dropdown"> and 2 input elements

Upvotes: 1

Related Questions