bootstrap label next to input

Question

I'm trying to put an input field's label next to it instead of above it using bootstrap. Wrapping this in form-horizontal works, but it's not actually in a form (just an ajax call that reads the value). Is there a way to simply move the label to the left side of the input?

    <div class="controls-row">
        <div class="control-group">
            <label class="control-label" for="my-number">ALabel</label>

            <div class="controls">
                <input id="my-number" type="number"/>
            </div>
        </div>
    </div>    

The fiddle is at http://jsfiddle.net/7VmR9/

Answer 1

Yes, you can do this by bootstrap column structure.

<div class="form-group">
  <label for="name" class="col-lg-4">Name:</label>
    <div class="col-lg-8">
      <input type="text" class="form-control" name="name" id="name">
    </div>
</div>

Here is a Bootply Demo

Answer 2

The div is a block element, that means it will take as much width as it can and the input element is in it.

If you want the label to be next to the input element: either put the label in the div or make the div an inline-block element.