JQuery Mobile選擇列表對齊

我有一個JQuery移動窗體，除了不正確對齊的選擇列表項以外，它工作得很好。我還不能添加圖片，但所有字段都在左側標註了一個空白，然後所有字段都對齊了。選擇菜單會留下間隙，並使字段緊跟在標籤後面，因此它位於所有其他標籤的左側。JQuery Mobile選擇列表對齊

代碼的相關代碼段是在這裏：

<div data-role="fieldcontain"> 
<label for="sms-alert"><b>SMS Alert:</b></label> 
     <select name="sms-alert" id="sms-alert" data-role="slider"> 
      <option value="off">Off</option> 
     <option value="on" selected="true">On</option> 
     </select> 
</div> 

<div data-role="fieldcontain" > 
    <label for="user_group" ><b>User Group:</b></label> 
    <select name="select_user_group" id="select_user_group" > 
     <option value="manager" >Manager</option> 
     <option value="delivery" >Delivery</option> 
     <option value="kitchen" >Kitchen</option> 
     <option value="serving" >Serving</option> 
    </select> 
</div>

...

我對這個項目沒有具體的CSS風格特點。在eclipse IDE瀏覽器，Chrome和iOS Chrome，Safari和iOS Safari上的行爲是相同的。

任何線索，將不勝感激。

感謝，

格倫

來源

2012-12-28 glimmer

你必須要在第二個選擇標籤錯誤。這* for =「user_group」*是不正確的，它需要指向*正確的id =「select_user_group」*。所以，你的第二個選擇框應該是這樣的：

 <div data-role="fieldcontain" > 
      <label for="user_group" class="select"><b>User Group:</b></label> 
      <select name="user_group" id="user_group" > 
       <option value="manager" >Manager</option> 
       <option value="delivery" >Delivery</option> 
       <option value="kitchen" >Kitchen</option> 
       <option value="serving" >Serving</option> 
      </select> 
     </div>

這裏是爲您的工作例如：http://jsfiddle.net/Gajotres/Y3pzf/

來源

2012-12-28 12:02:16 Gajotres

這是正確的。 'for'參數的標籤必須具有與'id'參數相同的名稱。 –

嗨，那是偉大的，那有效。在我閱讀你的回覆之前，我自己也得出了同樣的結論。對於不得不打擾你的語法錯誤抱歉，但我一直在努力工作幾個小時，只是看不到它。非常感謝您的幫助。 – glimmer

JQuery Mobile選擇列表對齊

回答

相關問題