Survey form question

I was following a guide on YouTube on how to make a basic survey website. I basically used the same code just different questions.

Theres a name, age, and email input box, that won’t increase in size width wise, and idk why.

<div class="input-element">

<label id = "name-label">Name<input type="text" id="name" placeholder="name" required/></label>

</div>

<div class="input-element">

<label id = "email-label">Email<input type="email" id="email" placeholder="email" required/></label>

</div>

<div class="input-element">
<label id = "number-label">Age<input type="number" min="5" max="100" id="age" 
placeholder="age" type="number" required/></label>

</div>

Above is the inputs I used

To try and make the input boxes larger, in css I styled it like

.input-element {
margin: 10px;
display: flex;
flex-direction: column;
width: 100%;

}

You made the div element of 100% width, but you didn’t change the ‘input’ elements in between. Add the ‘input’ selector in css with the ‘width’ property set to a value of e.g. 500px, and you will see for yourself.