0

次のフォームがあります。

    <div class="form-horizontal">
   <fieldset>
      <legend>Reports</legend>
      <div class="control-group">
         <label class="control-label">Year</label>
         <div class="controls">
            <select id="ddlYear" class="input-small">
               <option value="2011">2011</option>
               <option selected="selected" value="2012">2012</option>
            </select>
         </div>
      </div>
      <div class="control-group">
         <label class="control-label">Project</label>
         <div class="controls">
            <label class="" id="lbProjectDesc">House X repairs</label>
         </div>
      </div>
      <div class="control-group">
         <label class="control-label">Costs</label>
         <div class="controls">
            <div class="input-append">
               <input type="text" value="0,0" class="span2" id="tbCosts" disabled="disabled"  >
               <span class="add-on">€&lt;/span>
            </div>
         </div>
      </div>
      <hr>
      <div class="control-group">
         <div class="controls">
            <input type="submit"  value="Save" onclick="$(this).button('loading');" id="btnSave" class="btn btn-primary" data-loading-text="Saving...">
         </div>
      </div>
   </fieldset>
</div>​

http://jsfiddle.net/9JNcJ/2/

問題は、ラベルlbProjectDesc(text = "House X repairs")が正しく表示されないことです。

どのクラスを設定できますか、またはそれを修正するためにどのような変更を加える必要がありますか?(CSSハックではなく、正しい方法が望ましい)

4

3 に答える 3

1
#lbProjectDesc {
margin-top: 5px;
}

(doesn't consider this as a "hack" :) forked : http://jsfiddle.net/davidkonrad/LK95Q/

于 2012-11-08T12:00:07.813 に答える
1

Selvaとdavidkonradの応答を考慮して、次のように解決しました。

.form-horizontal .control-group .controls label {
 margin-top: 5px;
}

このように、ラベルが水平フォーム内にあるが、他の入力タイプの説明ラベルを垂直方向に移動しないすべての場合に影響します。

パディングでも機能します-top:5px;

于 2012-11-08T12:45:57.350 に答える
0

そこから不要なパディングを避け、好きなように設定してください。ここで問題はパディングです。

 #lbProjectDesc {
 margin-top: 5px;
}

追加して参照してください。

デモ: http: //jsfiddle.net/9JNcJ/5/

于 2012-11-08T12:03:24.380 に答える