0

JQM を使用してモバイル アプリを作成し、data-role="fieldcontain" を使用してフィールドセットにグループ化されたラジオ ボタンを中央に配置しようとしています。JQM 1.2.0 を使用すると、ラジオ ボタンが中央に配置されず、互いに重なり合っていることがわかりました (画像を参照)。JQM 1.0.0 に戻すと問題が修正され、ボタンは完全に中央に配置されます (画像を参照)。この問題を修正する方法についての提案はありますか? 前もって感謝します。

    <div data-role="header">
    </div>

    <div data-role="content">
       <div id="fieldcontain-wrapper" style="display:table;margin:0 auto;">
            <div data-role="fieldcontain">
                <fieldset data-role="controlgroup" data-type="horizontal" data-mini="true">
                        <input type="radio" name="radio-choice-b" id="radio-choice-c" value="on" checked="checked" />
                        <label for="radio-choice-c">&nbsp;&nbsp;Home&nbsp;&nbsp;</label>
                        <input type="radio" name="radio-choice-b" id="radio-choice-d" value="off" />
                        <label for="radio-choice-d">&nbsp;&nbsp;Away&nbsp;&nbsp;</label>
                </fieldset>
            </div>
       </div>
    </div>

JQM 1.2.0 JQM1.0

4

1 に答える 1

1

これは、ラッパーdivによって引き起こされる奇妙なjQMバグです。このcssはそれを修正します：

.ui-controlgroup-controls {
    width: 100% !important;
}

何らかの理由で、同じ最小幅に達した後、ui-controlgroup-controlsの幅は78％になります。本当に奇妙です。

そして、ここに例があります。cssブロックを削除して、その動作の欠如を確認します。 http://jsfiddle.net/Gajotres/vHy9U/

于 2012-12-29T09:39:45.870 に答える