This is the closest I could get without adding any custom CSS (this I'd already figured as of the time of asking the question; guess I've to stick with this):
And the markup in use:
<form class="navbar-form navbar-left" role="search">
<div class="form-group">
<input type="text" class="form-control" placeholder="Search">
</div>
<button type="submit" class="btn btn-default">
<span class="glyphicon glyphicon-search"></span>
</button>
</form>
PS: Of course, that can be fixed by adding a negative margin-left
(-4px) on the button, and removing the border-radius
on the sides input
and button
meet. But the whole point of this question is to get it to work without any custom CSS.