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

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

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

Подписаться 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,

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

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

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

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

CSS

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

ответ
HTML

+1 ещё

Простой
Что не так с вёрсткой кнопок?
- 1 подписчик
- 14 февр.
- 204 просмотра
2

ответа
HTML

+1 ещё

Простой
Как сменить цвет символа без тега и класса?
- 1 подписчик
- 14 февр.
- 122 просмотра
3

ответа
HTML

+1 ещё

Простой
Как сделать независимые друг от друга блоки?
- нет подписчиков
- 13 февр.
- 103 просмотра
0

ответов
CSS

Простой
Какой display задать, чтобы получилась вот такая колонка?
- 1 подписчик
- 13 февр.
- 203 просмотра
1

ответ
CSS

Простой
Как понять откуда лишнее пространство у страницы?
- 2 подписчика
- 13 февр.
- 127 просмотров
0

ответов
Вёрстка

Простой
Как сверстать такую кнопку?
- 1 подписчик
- 13 февр.
- 102 просмотра
0

ответов
CSS

Простой
Background color элемента не отрисовывается в области открываемой через скролл, в чем дело?
- 1 подписчик
- 13 февр.
- 41 просмотр
1

ответ
HTML

+1 ещё

Простой
Не выставляются карточки с помощью gap так как надо?
- 1 подписчик
- 12 февр.
- 64 просмотра
1

ответ
JavaScript

+2 ещё

Средний
Как запретить оверлею загораживать отдельно взятый элемент? Как выбить/поднять/отменить дочерний элемент из контекста наложения?
- 2 подписчика
- 12 февр.
- 207 просмотров
2

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

Fullstack Developer под Wordpress

Future Search

от 90 000 до 150 000 ₽

JavaScript FullStack разработчик

Rocket • Смоленск

от 80 000 до 130 000 ₽

Frontend developer (Vue.js)

Хабр • Москва

от 250 000 до 300 000 ₽

Парсинг социальных сетей вк и тг.

16 февр. 2025, в 22:02

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

Разработать динамический алгоритм кэширования (+ интерфейс)

16 февр. 2025, в 22:01

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

Парсинг сайтов-каталогов

16 февр. 2025, в 21:51

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

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, расположение?

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

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

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