Survey Form - Build a Survey Form

HTML-CSS
1

Hi everyone, hope you are doing great.

help1
help1732×474 31.7 KB

I am beginner and I have a question in regard to my progress so far, I am creating the form, but in the preview, I can see that the elements are inline, this is weird to me because I think that on the previous projects each time I created a new label or form element, it was displayed below the previous one, now I see that all of them are inline, I just want to know what I am doing wrong or if is something I need to style later on css? sorry if is a basic question but I have not found any answer so far.

Your code so far

<!-- file: index.html -->
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8">
    <link rel="stylesheet" href="styles.css" />
    <title>Calisthenic Form</title>
  </head>
  <body>
    <h1 id="title">Calisthenic Form</h1>
    <p id="description">Let us know your favorites calisthenic's excersices.</p>
    <form action='https://register-demo.freecodecamp.org' id="survey-form">
    <fieldset>
      <label for="name">Full Name: <input id="name" name="name" type="text" required /></label>
     <label for="email">Email: <input name="email" id="email" type="email" required /></label>
     <label for="age">Age: <input id="age" name="age" type="number" min="15" max="120" /></label>
    </fieldset>
    <input type="submit" value="Submit">
    </form>
  </body>  

/* file: styles.css */

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/111.0.0.0 Safari/537.36 Edg/111.0.1661.54

Challenge: Survey Form - Build a Survey Form

Link to the challenge:

2

Hey @bgSebs you can use <br> tags after the element to make elements appear on a new line.

3

In between these two elements add a <br> tag it will make the email input box appear in the next line. Apply this for the rest of the others too.

1 Like
4

Yes, you should style it later.

5

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.