Не может горизонтально центрировать горизонтальные наборы переключателей - PullRequest
1 голос
/ 28 ноября 2011

Я использую jQuery Mobile, и у меня установлен горизонтальный переключатель.

Я бы хотел центрировать его на странице, или Я бы хотел растянуть его так, чтобы он занимал 100% ширины. Либо было бы хорошо для того, что я делаю. Я пробовал много разных подходов, но ни один из них не работал до сих пор. Использование jQuery Mobile v1.0

    <fieldset data-role="controlgroup" data-type="horizontal">
        <input type="checkbox" name="monday" id="monday" class="custom"/>
        <label for="monday">Monday</label>
        <input type="checkbox" name="tuesday" id="tuesday" class="custom" />
        <label for="tuesday">Tuesday</label>
        <input type="checkbox" name="wednesday" id="wednesday" class="custom" />
        <label for="wednesday">Wednesday</label>
        <input type="checkbox" name="thursday" id="thursday" class="custom" />
        <label for="thursday">Thursday</label>
        <input type="checkbox" name="friday" id="friday" class="custom" />
        <label for="friday">Friday</label>
        <input type="checkbox" name="saturday" id="saturday" class="custom" />
        <label for="saturday">Saturday</label>
        <input type="checkbox" name="sunday" id="sunday" class="custom" />
        <label for="sunday">Sunday</label>
    </fieldset>

Ответы [ 2 ]

2 голосов
/ 28 ноября 2011

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

Добавление style="text-align: center;" в <fieldset> работает для контрольной группы с кнопками, но, по-видимому, не для флажков.

1 голос
/ 17 марта 2012

У меня была такая же проблема, и я решил ее, добавив, поместив fieldset в div с text-align: center, а затем установив display fieldset в inline.

Например

HTML

<div class="custom">
    <fieldset data-role="controlgroup" data-type="horizontal">
        <input type="checkbox" name="monday" id="monday" />
        <label for="monday">Monday</label>
        ...
    </fieldset>
</div>

CSS

.custom {
    text-align: center;
}
.custom fieldset {
    display: inline;
}

Настройка display дляfieldset до inline могут иметь некоторые другие эффекты, например, я заметил, что поля / отступы немного изменились, но кроме этого он сделал то, что хотел.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...