Nate Nate - 7 months ago 51
CSS Question

How to put multiple Bootstrap inputs on same line?

I have the following HTML:

<input type="text" class="form-control" name="watch" value="" placeholder="watch">

<div class="input-group">
<span class="input-group-addon">$</span>
<input type="number" class="form-control" name="price" value="" placeholder="Price (optional)" style="width: 140px;">

<span class="btn btn-primary" onclick="update($(this));"><span class="glyphicon glyphicon-upload" aria-hidden="true"></span> Update</span>


It renders like this:

enter image description here

How can I get both inputs and the button on the same line? I've been messing with the CSS but can't seem to get it to work. I was able to get it working with a table, but I know a CSS solution would be "better."


You can use Inline Forms like in the Bootstrap Documentation found here:

The 'form-inline' class is probably what you're looking for.