0

Всех приветствую, создал форму с inpyt с типом radio Захотел изменить цвет обводки но при изменении border, обводка не отображается, ошибок никаких не выдает

Пробовал: убрать все стили у div и оставить только border у inpyt,создать новые input и добавлять туда border, указывать border разными методами

Код формы:

.radio_btn {
  border-radius: 50%;
  border: 2rem dashed red;
  background-color: red;
  width: 28px;
  height: 28px;
  margin-top: 12px;
  margin-left: 0px;
}
<div class="all_menu_tarif">
  <h1 class="name_menu_generation" id="name_menu_generation_id">Управление пользователем</h1>
  <div class="tarif_menu" id="tarif_menu_id">
    <form class="generation_menu_form" method="post">
      <h2 class="generation_menu_name">Выдать пользователю тариф</h2>
      <div class="generation_tg_id">
        <input type="number" id="generation_id" name="generation_id" required>
        <img src="{{ url_for('static',filename='user.png')}}" class="user_gen">
        <label class="generation_id_text">ID пользователя</label>
        <br>
      </div>

      <div class="text_radio_btn">
        <h4>Выберите тариф</h4>
      </div>
      <div class="displey_radio">

        <input class="radio_btn" type="radio" id="tarif_base" name="tarif">

        <input class="radio_btn" type="radio" id="tarif_advens" name="tarif">

        <input class="radio_btn" type="radio" id="tarif_prem" name="tarif">

      </div>
      <div class="lable_hei">
        <label class="lable_tarif_base">Базовый</label>
        <label class="lable_tarif_adv">Продвинутый</label>
        <label class="lable_tarif_prem">Премиум</label>
      </div>
      <br>

      <input type="submit" id="button_gen">
      <p class="button_aut_text">Добавить</p>
    </form>
  </div>
</div>

1
  • Вот несколько вариантов стилизации для радио-кнопок - snipp.ru/html-css/style-radio
    – ksa
    Commented 5 сент. 2023 в 7:13

1 ответ 1

1

используйте свойство appearance: none;, а потом стилизуйте как надо

1
  • Спасибо, все работает
    – Dozzier
    Commented 5 сент. 2023 в 12:57

Ваш ответ

Нажимая «Отправить ответ», вы соглашаетесь с условиями пользования и подтверждаете, что прочитали политику конфиденциальности.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.