Survey Form - Build a Survey Form

HTML-CSS
1

Tell us what’s happening:

Your #submit should have a type of submit.
is still telling me to input the type=“submit”

Your code so far

<!-- file: index.html -->
<!DOCTYPE html>
<html>
  <head>
    <title> Survey Form
</title>
    <link rel="stylesheet" href="styles.css" />
  </head>
  <body>
    <h1 id="title"> Survey Form
</h1>
<p id="description">Please fill out the survey form to help improve our service</p>
  <form id="survey-form" action="">
    <fieldset>
      <label id="name-label" for="name">Name<input value="name" id="name" type="text" placeholder="Enter your name" required></label>
      <label id="email-label" for="email">Email<input value="email"  placeholder="Enter your email"  id="email" type="email" required></label>
      <label id="number-label" for="number">Number<input value="number" placeholder="Enter your number"  id="number" type="number" min="12" max="12" required></label>
    </feldset>
    <fieldset>
      <select id="dropdown">
        <option value-disable>which of the coffe flavor do you prefer</option>
        <option>Vanilla</option>
        <option>chocolate</option>
        <option>Strawberry</option>
        </select>
      </fieldset>
      <fieldset>
        <p>Would you recommend Coffee delicios shop to a friend?</p><label>Yes<input  value="yes" id="survey-form" id="submit" type="radio" name="samegroup"></label>
        <label>no<input  value="no" id="submit" id="survey-form" name="samegroup" type="radio"></label>
        <label>prefer not to answer<input value="prefer not to answer" id="survey-form" id="submit" type="radio" id="survey-form" name="samegroup"></label>
        </fieldset>
        <fieldset>
        <p id="survey-form">which of the following do you prefer with coffee</p>
        <label>Cake<input id="survey-form" name="biscuitorcake" value="cake" type="checkbox"></label>
        <label>Biscuit<input name="biscuitorcake"  id="survey-form" value="biscuit" type="checkbox"></label>
      </fieldset>
      <label>Additional comments
      <textarea id="survey-form"  id="comments" class="input-textarea" name="comment" placeholder="Enter your comment here..."></textarea></label>
      <input type="submit" value="submit">
  </form>     
</body>
  </html>

/* file: styles.css */
body{
  background-image: url(https://cdn.freecodecamp.org/curriculum/css-cafe/beans.jpg);
  font-family: sans-serif;
  padding: 20px;
  margin:auto;
}
h1{
  text-align:center;
  padding:15;
  background-color:brown;
}
.description {
  font-style: italic;
  font-weight: 200;
  text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.4);
}

form{
  width: 60vw;
  max-width: 500px;
  min-width: 300px;
  margin: 0 auto;
   background: var(--color-darkblue-alpha);
  padding: 2.5rem 0.625rem;
  border-radius: 0.25rem;
}

label {
  margin: 0.5rem 0;
   display: flex;
  align-items: center;
  font-size: 1.125rem;
  margin-bottom: 0.5rem;
}
fieldset{
   width: 80%;
  background-color: burlywood;
  margin-left: auto;
  margin-right: auto;
  padding: 2.5rem 0.625rem;
  max-width: 500px;
}

Your browser information:

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

Challenge Information:

Survey Form - Build a Survey Form

2

this selector what does it use to target an element?

3

<input type="submit>

4

not what I am asking, you have different type of selectors things like input and then things like #submit and things like .main-section. What attribute is the target of a selector like #submit?

differently, if you need to target this with the # selector, what do you write?

5

i use input selector

6

what is an input selector?

7

also try to answer to this question

if you need to target this with the # selector, what do you write?

8

label {}
or .name-label

is that right?

9

any help please freecode camp staff

10

This doesn’t quite look right. That’s a class selector. Do you know how to select an id in CSS?

11

Hi there!

Hint: With # , you can select an element as an id attributes value within css file. For the test case, You should have a #submit element within html.

1 Like
12

This doesn’t quite look right. That’s a class selector. Do you know how to select an id in CSS? yes i can

13

can you please show an example?

14

example of a class selector ?

15

When you create a selector with # within css file to target an element, what attribute should you use within html file for that element?

16

you just said you know how to use an id selector, show an example of that please

1 Like
17

@suleimanahmad3247, we are asking you to give us an example of how to select an id in CSS.

That’s great to hear. Now, as @im59138 kindly asked, if you could show us an example of how to do it, that would be very helpful in us explaining to you why you can’t pass the test.

Here’s a prompt for you to work from:

<div id="green-box"></div>

How would you select this element in CSS to add a background-color of green to this div?

(what would you put here?) {
  width: 100px;
  height: 100px;
  background-color: green;
}

If you have no idea what we’re talking about, please let us know, explaining in detail what exactly it is that you don’t understand. Being communicative is extremely helpful when solving problems.

Thank you!

1 Like
18

i dont have problem with the css selector

this is instruction: Your submit should have a type of submit .

and this is myy input

after the input above im still getting error

19

Yes, I know, but answering this question will help us explain how to fix your submit input.

20

Currently your above input type submit didn’t have reference to #submit. You need to add an attribute with the value submit that refers to #submit.

1 Like