CSS: Как изменить интервал между переключателем и текстом?
Как изменить интервал между переключателем и текстом?
У меня есть следующий HTML:
<input type="radio" name="beds" value="1" />1+
<input type="radio" name="beds" value="2" />2+
Что-то вроде этого рисунка:
o 1+ o 2+
Как изменить интервал между переключателем и текстом "1+"? Я бы хотел, чтобы текст был ближе к переключателю, но браузер вставляет некоторые из undefined дополнений между двумя элементами.
Ответы
Ответ 1
Многие элементы HTML имеют настройку по умолчанию. Вы можете переопределить это значение и установить его в 0. В вашем случае вы хотите reset margin-right
на переключателе:
<input type="radio" name="beds" value="1" style="margin-right: 0" />1+
Возможно, вы захотите добавить его в таблицу стилей, чтобы он применим ко всем переключателям:
input[type="radio"] {
margin-right: 0;
}
Ответ 2
Вам понадобится элемент label
.
<input type="radio" name="beds" value="1" id="first" /><label for="first">1+</label>
<input type="radio" name="beds" value="2" id="second" /><label for="second">2+</label>
Затем вы можете сделать это следующим образом:
label {
margin-left: -3px;
}
Также обратите внимание на использование атрибута for
для целей доступности.