ブートストラップのラベルを入力の隣に

Question

私はブートストラップを使用しているのではなく、入力フィールドのラベルをその隣に置こうとしています。 form-horizontalでこれをラップしますが、実際にはフォームにはありません（値を読み取るだけのajax呼び出し）。ラベルを入力の左側に移動する方法はありますか？ http://jsfiddle.net/7VmR9/

Answer 1

divが、それはそれができるとinput要素がそれである限り幅を取る意味block要素、ある時

<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>  

フィドルです。

あなたはlabelがinput要素に次のようにしたい場合：divにlabelを入れたりdivinline-block要素を作るのいずれか。

Answer 2

あなたが提供したWebサイトから直接ヘルプを受けることができます。ここで

はい、あなたはブートストラップ列構造によってこれを行うことができますFiddle with Bootstrap css.

<div class="control-group"> 
<label class="control-label" for="inputEmail">Email</label> 
<div class="controls"> 
    <input type="text" id="inputEmail" placeholder="Email"> 
</div> 

Answer 3

です。ここで

<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> 

Bootply Demo

Answer 4

<form class="form-inline"> 
    <div class="form-group"> 
     <label for="my-number">ALabel</label> 
     <input type="number" id="my-number" class="form-control"> 
    </div> 
</form> 

ソースです：私はここで答えhttps://getbootstrap.com/docs/3.3/css/#forms-inline