Survey Form - Build a Survey Form

HTML-CSS
1

Hello everyone, I am currently stuck on the survey form project.While I have written the html aspect to my satifaction, the CSS modifications do not seem to be applying to my work. Is there anything I am missing?

/* file: index.html */
<!DOCTYPE html>
<html>
<head>
  <title>
    FreeCodeCamp Survey Form
  </title>
  <link rel="stylesheet" href="sytles.css">
</head>
<body>
  <h1 id="title"> freeCodecamp Survey Form</h1>
  <p id="description"> Educating the next generation of developers.</p>
  <form action="https://survey-form.freecodecamp.rocks" id="survey-form">
   <fieldset>
     <label id="name-label">
       Name: <input type="text" id="name" placeholder="Enter your name" required name="name" ></input></label>
      <label id="email-label"> Email: <input type="email" id="email" placeholder="Enter your email" required name="email" ></input></label>
     
     <label id="number-label">
       Number: <input type="number" id="number" min="0" max="9" placeholder="Enter your number" name="number"></input></label>
   </fieldset>
   <fieldset>
     <label>Has this platform helped you so far?
      <select id="dropdown" name="feedback">
       <option value="">Select one</option>
       <option value="yes">Yes</option>
       <option value="no">No</option>
       
      </select>
     </label>
     <label>
       Are you almost done?
       <label> Yes <input type="radio" name="progress" value="yes" > </input></label>
       <label> No <input type="radio"name="progress" value="no" > </input>
     </label>
   </fieldset>
   <fieldset name="motivation">Why are you venturing into tech?
     <label>Money<input type="checkbox" value="money" ></input></label>
     <label>Passion<input type="checkbox" value="passion" ></input></label>
     <label>Tech is the future<input type="checkbox" value="the-future" ></input></label>
     <label>Financial Freedom<input type="checkbox" value="financial-freedom" ></input></label>
     <label>Additional Comments
       <textarea rows="3" cols="30" ></textarea>
     </label>
   </fieldset>
   <input type="submit" id="submit" name="submit" value="Submit">

    
  </form>

</body>
</html>

/* file: styles.css */
h1,p{
margin: 0 auto;
}
body{
background-color: purple;
color: grey;
font-family: Times New Roman;
font-size: 16px;
}
form{
border: none

}
input{
display: block;
}

  **Your browser information:**

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

Challenge: Survey Form - Build a Survey Form

Link to the challenge:

2

Hi!

<link rel="stylesheet" href="sytles.css">

Try adding a / slash just before the closing bracket. This isn’t usually required to validate a link to a css stylesheet and we’re currently working to correct that.

3

Hi Ella! Thank you for your response, but the CSS effect is still not reflecting on my work. Is it a general problem?

4

Check for typos and I think you’ll find your issue :slight_smile:

1 Like
5

Wow! Thanks Daniel! I have found the typo. I really need to train my eyes henceforth to see errors better.

6

No problem! And yeah, it’s a good thing to train yourself to do now, because when you reach JavaScript, even the tiniest typo — like spelling the same word with an uppercase letter instead of a lowercase letter — can cause havoc :grimacing:

Oh, also, when you have a chance, please go back to my reply and mark the problem as solved to close out the post :slight_smile:

7

Noted , Daniel. Thanks!

1 Like
8

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