jQuery Mobileの設定に問題があるチェックボックスコントロールグループ。以下に、チェックボックスがどのように想定されていたか、そして現在どのように私のアプリケーションに含まれているかがわかります。どうやら、私のコントロールグループの内部間隔は予想よりも大きく、CSSのパディングやマージンのプロパティは変更していません。
ページのHTMLコードは次のとおりです。
<form>
<fieldset class="ui-field-contain" data-role="controlgroup" data-iconpos="right">
<legend>Swatch B:</legend>
<input type="checkbox" name="checkbox-t-2a" id="checkbox-t-2a" data-theme="a">
<label for="checkbox-t-2a">One</label>
<input type="checkbox" name="checkbox-t-2b" id="checkbox-t-2b" data-theme="a">
<label for="checkbox-t-2b">Two</label>
<input type="checkbox" name="checkbox-t-2c" id="checkbox-t-2c" data-theme="a">
<label for="checkbox-t-2c">Three</label>
</fieldset>
</form>
回答：
回答№1は1あなたのフィドルの「整頓」ボタンをクリックしてください、それはそれを調整します。
ボタン「確認」を正しく揃えるには、空のラベルを設定して ui-btn-inline クラス（ここでは追加のインラインスタイルは不要）
<div class="ui-field-contain">
<label for="btnConfirmar"></label>
<a id="btnConfirmar" href="#popupLogin" data-rel="popup" data-position-to="window" class="ui-btn ui-corner-all ui-shadow ui-icon-check ui-btn-icon-left ui-btn-a" data-transition="pop">Confirmar</a>
</div>
回答№2の場合は0
チェックボックス間のスペースはJQueryMobile Webサイトからコードをコピーします。 Chrome Dev Toolsを使用して要素を表示すると、このようなたくさんのスペースが表示されます。コード内のタグ間のスペースを削除するだけです。
あなたのフィドルからの開発ツールのスクリーンショット：
