Настройка заполнения ввода и выбора ⇐ CSS

[Anonymous]

Я пытаюсь создать регистрационную форму.
Первые 4 поля ввода (текст, адрес электронной почты, номер и выбор) находятся внутри div. Панель выбора не занимает то же пространство для заполнения, что и другие входные данные над ней, и находится немного левее, а также не учитывает минимальную высоту: 2em, которую я назначил как те, что над ней.
Кроме того, тексты надписей расположены не там, где ниже, а немного справа.
Текстовая область похоже, имеет ту же проблему, что и панель выбора.
Я попробовал задать для формы отступ 40 пикселей, а для ввода текстовую область и выбрать ширину 100%.

Код: Выделить всё

body{
background-color: #041f43;
color: #041f43;
font-family: Verdana, Geneva, Tahoma, sans-serif;
}

h1, p{
color: white;
text-align: center;
margin-top: 50px;
}

form{
max-width: 500px;
min-width: 300px;
border-radius: 10px;
background-color: white;
margin: 50px auto;
padding: 40px;
}

.group{
margin: 0 auto 1.25rem auto;
}

#name-label, #email-label, #number-label, #selection-label{
font-weight: bold;
padding: 10px;
}

input, textarea, select{
margin: 12px 0 12px ;
min-height: 2em;
width: 100%;
}

label{
display: block;
}

legend{
margin-bottom: 5px;
font-weight: bold;
}

.inline {
width: unset;
vertical-align: middle;
display: inline;
}

input[type="submit"] {
display: block;
width: 60%;
margin: 1em auto;
height: 2em;
font-size: 1.1rem;
background-color: #9494dd;
border-color: white;
color: white;
min-width: 300px;
}

Код: Выделить всё

    Welcome!
We're here to help you with your tasks!





Name:



E-mail:



Age (optional):



Select your age:

Select one
Social media
freeCodeCamp Podcast
Friend
Other



Would you recommend us to a friend?
Of course!

I don't think so


Maybe



Would you like to receive more information?
Newsletter


Discounts


Team Challenges


Daily Challenges




Do you have any comments or questions?

Подробнее здесь: https://stackoverflow.com/questions/785 ... and-select