Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to move the bootstrap button to left side

Here is my bootstrap code

    <div class="input-append" align="center">
    <input type="text" name="q" class="span2 search-query" placeholder="Snipp or Tag"
    />
    <button type="submit" class="btn">Search</button>
    <button class="btn btn-primary active"><i class="icon-white icon-plus"></i> plus</button>
    <button class="btn btn-primary active"><i class="icon-white icon-bullhorn"></i> Goto</button>
</div>

And here is a jsfiddle How give top-padding and how to give some space in between the buttons and move the plus and goto button to right side

like image 574
iJade Avatar asked Jan 23 '13 11:01

iJade


2 Answers

add another div for those 2 buttons and give float:right

And for gap between them give margin

button{margin-right:6px}

DEMO UPDATED

like image 95
Sowmya Avatar answered Nov 06 '22 23:11

Sowmya


if you want to float right you use the built in class "pull-right"

<div class="pull-right">...</div>

and for search more looking one will be

<form class="form-search">
    <div class="input-append" >
    <input type="text" class="span2 search-query input-large" placeholder="search posts,users..">
    <button type="submit" class="btn"><i class="icon-search"></i></button>
    </div>

and for keeping distance you can use margin

margin:10px
like image 24
Sujay sreedhar Avatar answered Nov 06 '22 23:11

Sujay sreedhar