https://codepen.io/kittyedlyn/pen/ExgjYYY?editors=1100
I am stuck here
if i put
on t
Summary
This text will be hidden
he label the word name, email, age are like this.
on t
<div class="form-selection">
<form id="survey-form">
<div class="input-container">
<label id="name-label" for="name">Name</label><br>
<input type="text" name="name" id="name" placeholder="Enter your name" required>
</div>
<div class="input-container">
<label id="email-label" for="email">Email</label><br>
<input type="email" name="email" id="email" placeholder="Enter your Email" required>
</div>
<div class="input-container">
<label id="number-label" for="age">Age(optional)</label><br>
<input type="number" name="age" id="number" placeholder="Age" min="18" max="99" required>
</div>
This is my code if I put <br> like this </label><br> and the result is in that photo the input type goes down and then my label it goes up but in the center.
The reason the label is centered is because you have text-align set to center on the body. I don’t think you want to do this, so get rid of that.
I’m not sure how you want the form elements to line up so give it a try again and if you can’t get it to work you can ask for more help. But I’m pretty sure you will not want to use text-align: center on any element and it might involve adding some width/max-width to elements and then you can center with auto side margins.
2 Likes
I’ve edited your post for readability. When you enter a code block into a forum post, please precede it with a separate line of three backticks and follow it with a separate line of three backticks to make it easier to read.
You can also use the “preformatted text” tool in the editor (</>) to add backticks around text.
See this post to find the backtick on your keyboard.
Note: Backticks (`) are not single quotes (’).
1 Like