JqueryMobile复选框不喜欢"数据内联"

Question

我正在使用MVC 3/Razor和jquery-mobile开发一个Web应用程序.在jquery-mobile中,通常你可以添加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.您需要做的就是将labelCSS属性更改display为inline-block.

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

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