Bootstrap: Combining input-append and input-block-level

If you have a button appended to an input control in Bootstrap, and you want it fill the entire width, it’s not sufficient to add the input-block-level to the input itself but this CSS class also needs to be added to the surrounding .input-append div. For example:

<div class="input-append input-block-level">
	<input type="text" class="search-query input-block-level" name="q" placeholder="Search">
	<button type="submit" class="btn btn-primary">Search</button>
</div>

Applying .input-block-level to only one of the elments (either the div or the input) just doesn’t work.

One thought on “Bootstrap: Combining input-append and input-block-level

  1. I agree with you, Guy. Applying .input-block-level to only one of the elements (either the div or the input) might just don’t work. Interesting short content, Guy.

    Looking forward for more. =)

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.