簡體   English   中英

如何對齊標簽和單選按鈕?

[英]How to align label and radio button?

當您閱讀此書時...我可能仍未解決我的問題,

我正在嘗試對齊標簽和單選按鈕,我嘗試了很多“解決方案”,但沒有任何效果。 我自己創建的單選按鈕上沒有CSS。

輸出: http : //prntscr.com/5am898

我的代碼:

<div class="row">
   <div class="col-md-12">
       <div class="btnRadio">
           <label class="radio-inline" for="gal2015lbl">
               <input name="galTab" id="gal2015" value="2015" type="radio">2015
           </label>
           <label class="radio-inline" for="gal2014lbl">
               <input name="galTab" id="gal2014" value="2014" type="radio">2014
           </label>
           <label class="radio-inline" for="gal2013lbl">
               <input name="galTab" id="gal2013" value="2013" type="radio">2013
           </label>
           <label class="radio-inline" for="gal2012lbl">
               <input name="galTab" id="gal2012" value="2012" type="radio">2012
           </label>
           <label class="radio-inline" for="galOtherlbl">
               <input name="galTab" id="galOther" value="Anders" type="radio">And
           </label>
       </div>
   </div>
</div>

嘗試將輸入內容放置在標簽之外。

<label class="radio-inline" for="galOtherlbl">
    And
</label>
<input name="galTab" id="galOther" value="Anders" type="radio">

將標簽放在標簽標簽中

<label class="radio inline control-label">Some label</label>

嘗試

現場演示

<div class="row">
   <div class="col-md-12">
       <div class="btnRadio">

               <input name="galTab" id="gal2015" value="2015" type="radio">
               <label class="radio-inline" for="gal2015lbl">2015</label>

               <input name="galTab" id="gal2014" value="2014" type="radio"> 
               <label class="radio-inline" for="gal2014lbl">2014</label>

               <input name="galTab" id="gal2013" value="2013" type="radio">
               <label class="radio-inline" for="gal2013lbl">2013</label>

               <input name="galTab" id="gal2012" value="2012" type="radio" />
               <label class="radio-inline" for="gal2012lbl">2012</label>

               <input name="galTab" id="galOther" value="Anders" type="radio"/>
               <label class="radio-inline" for="galOtherlbl">And</label>
       </div>
   </div>
</div>

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM