jquery - iCheck库:CSS样式问题

我将iCheck库用于几个单选按钮。我希望按钮及其标签全部显示在同一行上（请参阅jsFiddle here），但是在对元素进行适当样式设置时遇到了麻烦。

问题是（我认为）iCheck“将每个输入都用div包裹，可以由您或使用可用的皮肤之一自定义div”（引自iCheck页的“简单用法”部分）。

我尝试过的

-覆盖库CSS中的display属性，如下所示：


  .iradio_flat-orange {display：inline！important; }


结果-单选框完全消失。

-将标签包装在单个<span style="display: inline">中

结果-不变，根据jsFiddle显示单选按钮。

有谁知道如何正确设置单选按钮的样式？

最佳答案

您可以使用ul li列表使其正常工作，将input和label用li包装，并用display: inline-block;设置样式

See this Demo

的HTML

<p>Are you sure you want to have your details removed from our marketing list?</p>
<ul>
    <li>
        <input type="radio" name="iCheck">
        <label>Yes</label>
    </li>
    <li>
        <input type="radio" name="iCheck">
        <label>No</label>
    </li>

的CSS

ul {
    list-style:none;
}
ul li {
    display: inline-block;
    margin-left: 15px;
}

关于jquery - iCheck库:CSS样式问题，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/18718698/