Радиокнопка не выравнивается по центру в jquery mobile версии 1.0

Question

Я использовал радио-кнопку в своем мобильном приложении jquery, а я использую jquery mobile 1.0 и jquery 1.6.4.Проблема в том, что он всегда выровнен по левому краю.Итак, я попытался переместиться в центр, но это не работает.Как это исправить?Заранее спасибо.

<div id="userOptionGroup" data-role="contain">
          <fieldset data-role="controlgroup" data-type="horizontal" data-theme="b" style="font-size:12px;border:2px;">
                <input type="radio" data-theme="b" name="radio-choice-b" id="radio-choice-wuser" value="windowUser"  checked="checked" />
                <label for="radio-choice-wuser" style="font-size: 12px;" class="ui-btn-section-active" id="lblWindowUser">win user</label>
                <input type="radio" data-theme="b" name="radio-choice-b" id="radio-choice-muser" value="mfileUser" />
                <label for="radio-choice-muser" style="font-size: 12px;" id="lblMfileUser">M file user</label>
          </fieldset>
          </div>

Answer 1

Вы должны обернуть радиокнопки в элемент div с фиксированной шириной и полем, установленными на auto для набора полей. Вот как - конечно, лучше не использовать встроенный CSS.

<fieldset data-role="controlgroup" data-type="horizontal" style="text-align: center">
  <div style="width: 200px; margin: 0 auto;">
   <input type="radio" name="radio-choice-1" id="radio-choice-1" value="choice-1" checked="checked" />
   <label for="radio-choice-1">A</label>
   <input data-theme="e" type="radio" name="radio-choice-1" id="radio-choice-2" value="choice-2"  />
   <label for="radio-choice-2">B</label>
 </div>
</fieldset>

Answer 2

Я слишком стараюсь и, наконец, 1-й ответ на этот вопрос разрешит мою проблему. Это похоже на исправление мобильной ошибки jquery, но это должно быть исправлено без выполнения таких патчей :). Спасибо, Гампус.

Answer 3

вам нужно переписать этот класс в вашем файле CSS

.ui-checkbox .ui-btn-icon-left .ui-icon, .ui-radio .ui-btn-icon-left .ui-icon {
    left: 303px;// can vary according to your lay out
}

или вы можете определить свой собственный класс, который будет перезаписывать указанное выше свойство ... что-то вроде этого -

.leftAlign{left: 303px;}

затем назначьте этот класс диапазону, который содержит настраиваемую кнопку радиона, используя jquery ...

Answer 4

Я возьму ссылку, заданную nir :

Обернуть fieldset в div со стилем display: table; margin: 0 auto;.Это может быть чем-то вроде хака, но это работает без установки ширины или поля.

<div style="display: table; margin: 0 auto;">
    <fieldset data-role="controlgroup" data-type="horizontal" data-theme="b" style="font-size:12px;border:2px;">
        <input type="radio" data-theme="b" name="radio-choice-b" id="radio-choice-wuser" value="windowUser"  checked="checked" />
        <label for="radio-choice-wuser" style="font-size: 12px;" class="ui-btn-section-active" id="lblWindowUser">win user</label>
        <input type="radio" data-theme="b" name="radio-choice-b" id="radio-choice-muser" value="mfileUser" />
        <label for="radio-choice-muser" style="font-size: 12px;" id="lblMfileUser">M file user</label>
    </fieldset>
</div>

Answer 5

Выезд: https://forum.jquery.com/topic/radio-button-problem-rc3