Hi, so I’m trying to do the “build a survey form” part of the web design lesson, and I’m trying to get this text to not be in line with this part of the forum. What should I do? Not sure if I should send my code or not…
Please show us your code and also post the link to the challenge.
Hi @snailgirl,
Yes for help please always attach your entire code between 3 beginning backticks and 3 ending backticks.
(The backtick which is located to the left of your keyboard 1.)
Thanks,
Hal_Jordan
<td>Do you like your pet?</td>
<td>
<select id="dropdown">
<option value="">select one</option>
<option value="1">Yes</option>
<option value="2">Sort of</option>
<option value="3">No</option>
</select></td>
</tr>
<tr>
<td>What kind of pet do you have?</td>
</tr>
<td>Do you like your pet?</td>
<td>
<select id="dropdown">
<option value="">select one</option>
<option value="1">Yes</option>
<option value="2">Sort of</option>
<option value="3">No</option>
</select></td>
</tr>
<tr>
<td>What kind of pet do you have?</td>
</tr>
Hi @snailgirl,
So I see your code displays:
Do you like your pet? select one [dropdown menu] What kind of pet do you have?
What are you wanting it to look like?
A little more explanation would help.
Thanks,
Hal_Jordan
I want the “what kind of pet do you have” to be below the dropdown menu, but for some reason it’s next to it
Same with the radio buttons I’m trying to line up as well
I hope you have placed the <tr> tag inside the table tag?
ohhh, I don’t have that…but I’m also referencing another challenge I did that’s similar and there wasn’t a need for the table tag, I was just looking at other people’s challenges and they were using it. Here’s the code for a similar challenge I did
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Registration Form</title>
<link rel="stylesheet" href="styles.css" />
</head>
<body>
<h1>Registration Form</h1>
<p>Please fill out this form with the required information</p>
<form method="post" action='https://register-demo.freecodecamp.org'>
<fieldset>
<label for="first-name">Enter Your First Name: <input id="first-name" name="first-name" type="text" required /></label>
<label for="last-name">Enter Your Last Name: <input id="last-name" name="last-name" type="text" required /></label>
<label for="email">Enter Your Email: <input id="email" name="email" type="email" required /></label>
<label for="new-password">Create a New Password: <input id="new-password" name="new-password" type="password" pattern="[a-z0-5]{8,}" required /></label>
</fieldset>
<fieldset>
<label for="personal-account"><input id="personal-account" type="radio" name="account-type" class="inline" /> Personal Account</label>
<label for="business-account"><input id="business-account" type="radio" name="account-type" class="inline" /> Business Account</label>
<label for="terms-and-conditions" name="terms-and-conditions">
<input id="terms-and-conditions" type="checkbox" required name="terms-and-conditions" class="inline" /> I accept the <a href="https://www.freecodecamp.org/news/terms-of-service/">terms and conditions</a>
</label>
</fieldset>
<fieldset>
<label for="profile-picture">Upload a profile picture: <input id="profile-picture" type="file" name="file" /></label>
<label for="age">Input your age (years): <input id="age" type="number" name="age" min="13" max="120" /></label>
<label for="referrer">How did you hear about us?
<select id="referrer" name="referrer">
<option value="">(select one)</option>
<option value="1">freeCodeCamp News</option>
<option value="2">freeCodeCamp YouTube Channel</option>
<option value="3">freeCodeCamp Forum</option>
<option value="4">Other</option>
</select>
</label>
<label for="bio">Provide a bio:
<textarea id="bio" name="bio" rows="3" cols="30" placeholder="I like coding on the beach..."></textarea>
</label>
</fieldset>
<input type="submit" value="Submit" />
</form>
</body>
</html>
and here’s the link: https://www.freecodecamp.org/learn/2022/responsive-web-design/learn-html-forms-by-building-a-registration-form/
You should have a look at styles.css file of the challenge.
I figured it out! I needed the label elements to be p elements!
What does this mean?
I meant to say td
<td>What kind of pet do you have?</td>
so here the td elements should be p elements so that the lines are separated automatically, I think. But now that I’m also looking at the other challenge I did, I didn’t do that. It was just labels…but that didn’t work for the original challenge I’m doing right now.
Sorry if I’m making this sound super confusing, I think I mixed some things up
So the td is an inline element and p is a block element.
So p tags will get you to the new line, but I think you should not use p just for getting the text to a new line. p tag is a semantic tag.
This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.