Input radio, расположение?

Question

вовчек @vovvkka

Input radio, расположение?

Xg2kXFA3Ce4.jpg?size=810x1080&quality=96&sign=671eb8d7a75c7edb33989ffab576a56b&type=album

Суть такова, нужно расположить текст Male и Female в строку так, чтобы они были рядом с кружками.
Родительские Css свойства: display flex; flex-direction column.
Сам код:

label class="form-input"
                Gender
                input type="radio" name="1" Male
                input type="radio" name="1" Female
 /label

full: https://codepen.io/vovvkka/pen/ZEBQOGK

Вопрос задан более трёх лет назад
131 просмотр

Комментировать

Подписаться 1 Простой Комментировать

Решения вопроса 1

2 комментария

Пригласить эксперта

Ответы на вопрос 1

3 комментария

вовчек @vovvkka Автор вопроса

не работает,

Написано более трёх лет назад

Steppp @Steppp

<body>
  <main class="main">
    <aside class="aside">
      <h1>
        Sign up
      </h1>
    </aside>
    <section id="form">
      <h2>New User?</h2>
      <p>Use the form below to create your account.</p>
      <form>
        <div class="input-block input-name">
          <label class="form-input">
            First Name
            <input type="text" placeholder="Alice">
          </label>
          <label class="form-input">
            Last Name
            <input type="text" placeholder="Miller">
          </label>
        </div>

        <div class="input-block">
          <label class="form-input">
            Nationality
            <input type="text" placeholder="Russian">
          </label>
          <label class="form-input">
            E-mail
            <input type="email" placeholder="@google.com">
          </label>
        </div>

        <div class="input-block" style="displsy:flex; flex-direction: column;">
          <label class="form-input">
            Date of Birth
            <input type="text">
          </label>
          Gender
          <div class="">
            <label class="form-input" style="flex-direction: row">

              <input type="radio" name="1"> 
              <span>Male</span>

            </label>
            <label class="form-input" style="flex-direction: row ">
              <input type="radio" name="1"> 
              <span>Female</span>
            </label>
          </div>
        </div>
      </form>
    </section>

  </main>
</body>

Написано более трёх лет назад

вовчек @vovvkka Автор вопроса

Steppp,

Написано более трёх лет назад

Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации

Похожие вопросы

Вёрстка

Средний
Как правильно вставлять изображения при наличии двух тем оформления сайта?
- 1 подписчик
- час назад
- 58 просмотров
1

ответ
HTML

+1 ещё

Простой
Как в теге select один символ сделать другого цвета?
- 1 подписчик
- 2 часа назад
- 61 просмотр
1

ответ
CSS

Простой
Как уместить кроссбраузерную поддержку в одну строку?
- 1 подписчик
- 3 часа назад
- 74 просмотра
1

ответ
HTML

+1 ещё

Простой
Как поставить элементы в одну строку и выровнять их?
- 1 подписчик
- 17 часов назад
- 73 просмотра
1

ответ
HTML

+1 ещё

Простой
Почему не работает pattern на input?
- 1 подписчик
- 17 часов назад
- 64 просмотра
2

ответа
JavaScript

+3 ещё

Простой
Как стилизовать пагинацию постов по определённому признаку?
- 1 подписчик
- 19 часов назад
- 68 просмотров
1

ответ
HTML

+2 ещё

Простой
Как подкрасить 2 блока в разные цвета по всей ширине в дочернем Blade-шаблоне?
- 1 подписчик
- 21 час назад
- 53 просмотра
2

ответа
HTML

+2 ещё

Средний
Неправильное отображение верстки во всех браузерах локально на компьютере, в чем может быть проблема?
- 1 подписчик
- 21 час назад
- 71 просмотр
1

ответ
CSS

Простой
Как сделать так, чтобы при наведении на один объект, меняется другой, с помощью hover?
- 1 подписчик
- вчера
- 58 просмотров
1

ответ
JavaScript

+2 ещё

Простой
Как сделать так, чтобы звезда падала только при скролле страницы?
- 1 подписчик
- вчера
- 80 просмотров
0

ответов
Показать ещё Загружается…

Frontend-разработчик (React)

ДАЛЕЕ

от 130 000 ₽

Тестировщик-стажёр

ITooLabs • Тула

от 35 000 до 40 000 ₽

Fullstack PHP Developer

Smapse Education

от 40 000 до 65 000 ₽

Сделать мобильную версию сайта Next.js/React

19 апр. 2024, в 11:54

500 руб./в час

Реализовать Парсер сайта

19 апр. 2024, в 11:48

10000 руб./за проект

Собрать сайт на Vue / Laravel

19 апр. 2024, в 11:14

65000 руб./за проект

Answer 1 · 2021-02-04 22:33:13

Сергей delphinpro @delphinpro Куратор тега CSS

frontend developer

Ответ написан более трёх лет назад

2 комментария

Answer 2 · 2021-02-04 22:09:00

1 лабел 1 инпут! и для обьеденение их используйте тег fieldset
legend - заголовок

fieldset
legend "Gender"
label class="form-input"
input type="radio" name="1" Male
/label
label class="form-input"
input type="radio" name="1" Female
/label
/fieldset

Input radio, расположение?

Войдите, чтобы написать ответ

Минуточку внимания

Войдите на сайт