Survey Form - Build a Survey Form

HTML-CSS
1

Tell us what’s happening:
Describe your issue in detail here.

I am having an issue with my 2nd fieldset showing up. I’ve removed the fieldset and redid it and it’s still not popping up on the display when I put them on there. any tips on how to fix that or fix my code?

   **Your code so far**

/* file: index.html */
<!DOCTYPE html>
<html lang='en'>
 <head>
   <meta charset='utf-8'/>
   <title>Survey Form</title>
   <link rel='stylesheet' href='styles.css'/>
   </head>
   <body>
     <h1 id='title'>Survey</h1>
     <p id='description'>Thank you for taking your time to do my survey.</p>
     <form id='survey-form'/>
<!-------------first field------->
      <fieldset class='basic'>
        <h3>Getting to Know You</h3>
       <label for='name' id='name-label'>Full Name</label>
       <input id='name' type='text' name='name' class='box' placeholder='Enter your Name' required>
       <label for='email' id='email-label'>Email</label>
       <input id='email' type='email' name='email' class='box' placeholder='Enter your Email'required>
       <label for='number' id='number-label'><div class='font-size 1'>Age</div> <div class='font-size2'>(optional)</label> 
       <input id='number' type='number' min='13' max='200' name='age' class='box' placeholder='Age' required>
       <label for='employment'>Employment</label> 
       <select id='dropdown' name='employment' class='box' required>
         <option value=''>Select one</option>
         <option value='1'>Full-time Employee</option>
         <option value='2'>Part-time Employee</option>
         <option value='3'>Student</option>
         <option value='4'>Unemployed</option>
       </fieldset> 
   <!-------------second field------->
      <fieldset>
        <p>Questionaire</p>
        <label for='favorite-color'>What's your favorite color</label>

         </fieldset>
       </form>
     </body> 

/* file: styles.css */
h1, p {
text-align: center;
margin-top: 1.1em;
color: rgb(195,195,195);
margin-right: -75px 
}

h3{
 text-align: center 
}

.font-size {
font-size: 20px 
}

.font-size2 {
 font-size: 12px
}

.font-size2, .font-size {
 display: inline;
}

body {
 font-family: Georgia;
 background-color: #1b1b32;
 Color:  rgb(195,195,195)
}

form {
 max-width: 500px;
 min-width: 300px;
 margin: auto;
 padding-bottom: 2em;
}

.basic {
 border: none;
 border-bottom: 5px solid ;

}


.box{
 width: 525px;
 vertical-align: middle;
 min-height: 2em
}

label {
font-size: 20px; 
}

fieldset {
  margin: 0 auto;
  display: block;
  padding: 2rem
}



   **Your browser information:**

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:104.0) Gecko/20100101 Firefox/104.0

Challenge: Survey Form - Build a Survey Form

Link to the challenge:

2

if i was a bit confusing, my fieldset won’t show the text. it’ll show the input box but the text isn’t showing and it also won’t create the fieldset below my bottom border

4

just noticed this line as I was reviewing your code:

As you know form should not be self-closing element…

I will edit this post with more comments later if I find anything more to say.

Okay, it seems you have some more fixing to do here. I suggest you paste the html code in this online html validator. It will give you a list of errors. Please try to fix as many as possible (as you go this may also fix your initial issue).
Make sure you run the code through the validator after your updates are complete to catch any final stray errors.

If it doesn’t, please post the corrected code and we can take another look.

5

i didn’t even know that was a thing! ill check that and see what all is going on thank you :slight_smile:

6

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