Survey Form - Build a Survey Form (descendants issue)

Tell us what’s happening:
I am pretty much finished but it keeps telling me that my #dropdown, my radio buttons, my submit button, and my text area should all be a descendants of my #survey-form, which I thought they were. I can’t seem to find the issue. HELP

  **Your code so far**
/* file: index.html */
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <link rel="stylesheet" href="styles.css">
</head>
<body>
  <h1 id="title">Friendship Survey</h1>
<fieldset>  
  <p id="description">How was your time as my friend?
  </p>
</fieldset>
<fieldset>
<form id="survey-form">
   <label id="name-label">Name</label>
   <input id="name" type="text" required placeholder="Enter your name here"></input>
   <label id="email-label">Email</label>
    <input type="email" id="email" required placeholder="Enter your email"></input>
    <label id="number-label">Age</label>
    <input type="number" id="number" Min="18" max="100" optional placeholder="Optional"></input> 
  </fieldset>
  <fieldset>  
    <p id="rating">Rate your experience 1-5</p>
    <select id="dropdown" name="dropdown">
      <option disabled selected value>Choose one</option>
      <option value="1">1</option>
      <option value="2">2</option>
      <option value="3">3</option>
      <option value="4">4</option>
      <option value="5">5</option>
    </select>   
    <p id="question">What type of personality do I have?</p>
    <label><input name="group1" type="radio" value="normal" class="input-radio">Normal</label>
    <label><input name="group1" type="radio" value="goofy" class="input-radio">Goofy</label>
    <label><input name="group1" type="radio" value="psycho" class="input-radio">Psycho</label>
    <label><input name="group1" type="radio" value="boring" class="input-radio">Boring</label>
    <label id="checkbox">Check all that apply:</label>
    <label><input type="checkbox" value"Good-driver" class="list">Good Driver</label>
    <label><input type="checkbox" value="punctual" class="list">Punctual</label>
    <label><input type="checkbox" value="BDE" class="list">BDE</label>
    <label><input type="checkbox" value="Gay" class="list">Gay</label> 
  <p id="comment-section">Where could I improve?</p>
   <textarea name="Comment-section" rows="6" cols="30" placeholder="Write a Comment"></textarea>
   </fieldset>
   <button id="submit" type="submit" value="Submit">Submit</button>
  </form>
</body>    
</html>


/* file: styles.css */
body {
height: 100%;
width: 100%;
margin: 10;
top: 0;
bottom: 0;
text-align: center;
Background-color: #2d6f3a;
font-family: Tahoma;
font-size: 18;
}

h1, p {
margin: 0.5em auto;
text-align: center;
}

label {
display: block;
margin: 0.5rem;
text-align: center;

}
fieldset {
border: none;
padding: 1rem 0;
border-bottom: 3px solid #3b3b4f;
}

form {
width: 100vw;
max-width: 600px;
min-width: 300px;
margin: 0 auto;
padding-bottom: 1em;
}
input, textarea {
background-color: #3b3b2b;
border: 1px solid #0a0a23;
color: #ffffff;
}
textarea,
select {
margin: 10px 0 0 0;
width: 70%;
min-height: 2em; 
}
button {
display: block;
width: 40%;
margin: 1em auto;
height: 2em;
font-size: 1.1rem;
background-color: #3b3b2b;
border-color: white;
min-width: 300px;
}

  **Your browser information:**

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

Challenge: Survey Form - Build a Survey Form

Link to the challenge:

you have some issues in the code.
First one I found was this one:

    <fieldset>
        <form id="survey-form">
            <label id="name-label">Name</label>
            <input id="name" type="text" required placeholder="Enter your name here"></input>
            <label id="email-label">Email</label>
            <input type="email" id="email" required placeholder="Enter your email"></input>
            <label id="number-label">Age</label>
            <input type="number" id="number" Min="18" max="100" optional placeholder="Optional"></input> 
        </fieldset>

this type of overlapping of elements is not allowed.
(you opened the fieldset before you opened the form, but closed the fieldset before the form)
Try to fix that, and continue to look for other issues if needed. I will try an help on my end in the meantime…

Edit: I fixed this in the copy I’m using of your code and it worked.
Now you just have one error left to fix.
All your checkboxes inside #survey-form should have a value attribute and value.

Question… what value(s) are the radios/checkbox’s suppose to contain?

Value=“???”

Ty in advance

any unique value that identifies the specific element or option

Thank you.

I’m also having trouble getting a text line to appear. I believe it’s trapped under a previous drop down What would cause that. How to fix it. I can link code later after work … thx as always

If you have a question about a specific challenge as it relates to your written code for that challenge, and you’ve tried to solve it at least 3 times so far and still need some help, just click the Ask for Help button located on the challenge (it looks like a question mark).
This button will create a new topic with all code you have written and include a link to the challenge also. You will still be able to ask any questions in the post before submitting it to the forum.

Thank you.

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