JqueryMobile複選框不喜歡「數據在線」

Question

我正在開發一個帶有MVC 3/Razor和jquery-mobile的Web應用程序。 jQuery的移動，通常你可以添加data_inline = "true"到一個對象的屬性，它會防止元素從一路綿延在屏幕上，就像這樣：

@Html.DropDownListFor(m => m.value, options, new { data_inline = "true" }) 
@Html.ActionLink("Text", "Action", null, new {data_role="button", data_inline="true"}) 

這兩項的正常工作。但在一個複選框...

@Html.CheckBoxFor(m => m.value, new { data_inline = "true" }) 

...它似乎沒有做任何事情，我仍然得到一個討厭拉伸複選框。添加data_role="button"沒有幫助（不是我所期望的）。

這是爲什麼嗎？任何好的方法，我可以讓我的複選框不拉伸，而不訴諸手動CSS修改？

Answer 1

jQM複選框不支持data-inline。您所需要做的就是將label CSS屬性display更改爲inline-block。

<label class="inline"> 
    <input type="checkbox" name="chk0" class="ui-btn-inline" />Check me 
</label> 

.inline { 
    display: inline-block !important; 
}