CODEWITHSUNDEEP
csstwitter-bootstrap
Houman
Houman

Reputation: 66320

CSS: Can't align Button and Input together

In twitter bootstrap documentation, there is an interesting way to append a button right next to the input.

Just an example for illustration:

<div class="input-append">
<input class="span2" id="appendedInputButton" type="text">
<button class="btn" type="button">Go!</button>
</div>

In my case I am trying to utilize this concept but the button is slightly bigger (by one pixel) I can't figure out what is causing this.

enter image description here

I have created a fiddle, I hope someone can point me to the right direction.

http://jsfiddle.net/houmie/FkEnm/2/

Upvotes: 0

Views: 1043

Answers (1)

Gurpreet Singh
Gurpreet Singh

Reputation: 21233

I guess something else in your CSS causing this issue. You can fix this issue by overwriting your css. Make line-height from 20px to 19px on .btn class:

.btn { line-height: 19px }

Working DEMO

Upvotes: 1

Related Questions