jquery-mobile - jqm 1.2.0 iOS设备中单选按钮的页面宽度拉伸

Question

我想将水平单选按钮设置为屏幕的全宽，我指的是http://jquerymobile.com/demos/1.2.0/docs/forms/radiobuttons/，我的代码如下：

     <div> 
 <fieldset data-role="controlgroup" data-type="horizontal"> 
 <input type="radio" name="radio-choice-1" id="spent_money_1" value="choice-1" checked="checked" /> <label for="spent_money_1">Spent Some $</label>
 <input type="radio" name="radio-choice-1" id="made_money_1" value="choice-2"/>
 <label for="made_money_1">Made Some $</label> 
 </fieldset>
 </div>

我试图将 style="width:100%" 放在 div、fieldset 和 input 中，但也无济于事。请欣赏任何建议。谢谢 ！

干杯，马克

Answer 1

我一直有同样的问题。添加以下 CSS 对我有用。

这种情况适用于 4 个单选按钮，因此我为 ui-radio 使用 25% 的宽度。

.ui-controlgroup-controls
{
    width:100%;
}
.ui-radio {
    width:25%;
}

Answer 2

在您不想指定宽度的一般情况下（适用于 1.3.0）

.ui-controlgroup-controls
{
    display: table;
    width: 100%;
}

.ui-controlgroup-controls .ui-radio
{
    display: table-cell;
    float: none;
}