CODEWITHSUNDEEP
csstwitter-bootstrap
Arif
Arif

Reputation: 966

Bootstrap - gap between input text field and button

This my code http://jsbin.com/ixevaw/1/edit

<div class="input-append">
   <input type="search" class="span3" placeholder="Search" name="search" id="search"/>
   <button class="btn">button</button>
</div>

But there is a gap between text field and button in safari and IE9

How can i remove this gap?

Upvotes: 0

Views: 3644

Answers (2)

Emily Ryan
Emily Ryan

Reputation: 79

Bizarrely, if you remove the space between the tags the problem goes away. So you want it to look like this: 

<div class="input-append">
   <input type="search" class="span3" placeholder="Search" name="search" id="search"/><button class="btn">button</button>
</div>

Upvotes: 2

isherwood
isherwood

Reputation: 61055

This appears to be a Bootstrap bug. You'd probably have to put a -5px left margin on the button for those browsers only using detection or alternate stylesheets. 

.input-append input + .btn {margin-left: -5px;}

Upvotes: 1

Related Questions