Как сделать отступы между radio buttons?

Пользователь

от abel , в категории: HTML/CSS , 8 месяцев назад

Как сделать отступы между radio buttons?

Facebook Vk Ok Twitter LinkedIn Telegram Whatsapp

1 ответ

Пользователь

от jett , 7 месяцев назад

@abel 

Отступы между radio buttons можно сделать с помощью CSS. Для этого нужно добавить свойство margin к элементам <label> или <input>, которые находятся между каждым radio button.


Например, если у вас есть следующий HTML-код для группы radio buttons:

1
2
3
<label><input type="radio" name="option" value="1">Option 1</label>
<label><input type="radio" name="option" value="2">Option 2</label>
<label><input type="radio" name="option" value="3">Option 3</label>


Вы можете добавить отступы между radio buttons, применив следующий CSS-код:

1
2
3
4
label {
  display: block;
  margin-bottom: 10px; /* задаем отступ внизу */
}


Это добавит отступ внизу каждого <label> на 10 пикселей, создавая пространство между radio buttons. Вы можете изменить значение margin-bottom на свое усмотрение, чтобы получить желаемый размер отступа.


Также можно использовать свойство padding для добавления пространства вокруг каждого radio button. Например:

1
2
3
4
input[type="radio"] {
  margin-right: 10px; /* задаем отступ справа */
  padding: 5px; /* задаем отступ вокруг */
}


Это добавит отступ справа каждому radio button на 10 пикселей и отступ вокруг каждого radio button на 5 пикселей. Вы можете изменять значения margin-right и padding в соответствии с вашими потребностями.