Survey Form - Build a Survey Form

Tell us what’s happening: were can i fiend the source of the background image

Describe your issue in detail here.

Your code so far

<!-- file: index.html -->
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8">
    <mta name="viewport" content="width=device-width,initial-scale=1.0">
    <title>survey-form</title>
    <link rel="stylesheet" href="styles.css">
  </head>
  <body>
    <h1 id="title">freeCodeCamp Survey Form</h1>
    <p id="description"><i>Thank you for taking the time to help us improve the platfform</i></p>

    <form id="survey-form">
      <fieldset>
        <label for="name" name="name-label">Name</label>
      <input id="name" type="text" placeholder="Enter your name" required/>
      <label for="email" name="email-label">Email</label>
      <input id="email" type="email" placeholder="Enter your Email" required/>
      <label for="number" name="number-label">Age(optional)</label>
      <input id="number" type="number" min="10" max="100" placeholder="Age"/>
    </fieldset>
    <fieldset>
      <label for="dropdown">which option best describes your current role?</label>
      <select id="dropdown">
        <option value="">select current role</option>
        <option value="1">Student</option>
        <option value="2">Full Time Job</option>
        <option value="3">Full Time Learner</option>
        <option value="4">Prefer not to say</option>
        <option value="5">Other</option>
      </select>
    </fieldset>

    <fieldset>
      <legend>would you recommend freeCodeCam to a friend?</legend>
      <label for="definitely" name="definitely"><input id="definitely" type="radio" required/>Definitely</label>
      <label for="maybe" name="maybe"><input id="maybe" type="radio" required/>Maybe</label>
       <label for="not-sure" name="not-sure"><input id="not-sure" type="radio" required/>Not sure</label>
      </fieldset>
      <fieldset>
        <label for="dropdown-two">what is your favorite feature of freeCodeCam?</label>
      <select id="dropdown-two">
        <option value="">select an option</option>
        <option value="1">Challenges</option>
        <option value="2">Projects</option>
        <option value="3">Community</option>
        <option value="4">Open Sourece</option>
      </select>
    </fieldset>
    <fieldset>
      <legend>What would you like to see improved? (check all that apply)</legnd>
      <label for="front-end" name="front-end"><input id="front-end" type="checkbox" />Front-end Projects</label>
      <label for="back-end" name="back-end"><input id="back-end" type="checkbox" />Back-end Projects</label>
      <label for="data" name="data"><input id="data" type="checkbox" />Data Visualisation</label>
      <label for="challenges" name="challenges"><input id="challenges" type="checkbox" />Challenges</label>
      <label for="o-s-c" name="o-s-c"><input id="o-s-c" type="checkbox" />Open Sourse Community</label>
      <label for="g-h-r" name="g-h-r"><input id="g-h-r" type="checkbox" />Gitter help rooms</label>
      <label for="vidios" name="vidios"><input id="vidios" type="checkbox" />Vidios</label>
      <label for="city-meetups" name="city-meetups"><input id="city-meetups" type="checkbox" />City Meetups</label>
      <label for="wiki" name="wiki"><input id="wiki" type="checkbox" />Wiki</label>
      <label for="forum" name="forum"><input id="forum" type="checkbox" />Forum</label>
      <label for="additional-courses" name="additional-courses"><input id="additional-courses" type="checkbox" />Additional Courses</label>
    </fieldset>

    <fieldset>
      <label for="comment">Any comments or suggestions?<textarea id="comment" name="comment" rows="3" cols="30" placeholder="Enter your comment here..."></textarea></label>
      <label><input type="submit" value="submit"/></label>
    </fieldset>
    </form>
  </body>
  </html> 
/* file: styles.css */
body {
  width: 100%;
  height: 100vh;
  background-image: url("https//:cdn.freecodecamp.org/testable-projects-fcc/images/survey-form-background.jpeg")
  color: black;
font-family: Tahoma;
font-size: 16px
}
h1, p {
  margin: 1em auto;
  text-align: center;
}

label {
  display: block;
}

Your browser information:

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

Challenge Information:

Survey Form - Build a Survey Form

You appear to have created this post without editing the template. Please edit your post to Tell us what’s happening in your own words.
Learning to describe problems is hard, but it is an important part of learning how to code.
Also, the more you say, the more we can help!

were can i fiend the source of the background image

Hello!

I use pexels.com for free images, photos and videos. But there are other sources, too. I think pixabay.com and some others.

Make sure to open the picture in a new tab so you can get the link to it without needing to download it.

Local pictures do not work unless uploaded to a host.

Happy coding!

1 Like

thank you
that was helpfull

1 Like

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