Better integration between input-append and search-query

[jgutix]

Inserting a search-query textbox inside input-append for adding a button after, cause rounded sides to dissapear, with this markup:

<form action="" class="form-search">
     <div class="input-append">
         <input type="search" class="search-query span6"><button
             class="btn" type="button"><span class="icon-search"></span></button>
     </div>
  </form>

To fix that I create next css:

.form-search .input-append .search-query {
    border-top-left-radius: 14px;
    border-bottom-left-radius: 14px;
}
.form-search .input-append button:last-child{
    border-top-right-radius: 14px;
    border-bottom-right-radius: 14px;
}

Check it here: http://jsbin.com/icosan/3
That would be nice integrate it to boostrap css source to not use this trick

[thezoggy]

this is just one style.. i personally like doing something like:

http://jsfiddle.net/KwJXG/

but I wouldn't dream of making everyone put their search query in the navbar...

[taivo]

Can we get this same fix applied to navbar-search as well?

[mzgajner]

+1, this is indeed missing from navbar-search.