Thank very much. I’ve found it. Do you see it above 
???
Huzzah! Now I can see the issue.
Here is the starting code:
input,
textarea,
select {
margin: 10px 0 0 0;
width: 100%;
}
input, textarea {
background-color: #0a0a23;
border: 1px solid #0a0a23;
color: #ffffff;
min-height: 2em;
}
.inline {
width: unset;
margin: 0 0.5em 0 0;
vertical-align: middle;
}
You moved too much to the input, textarea, select selector. Only one line should move, but you moved two. Try putting the color back where it was
Tell us what’s happening:
Describe your issue in detail here.
Your code so far
<!-- file: index.html -->
<!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">
<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>
/* file: styles.css */
/* User Editable Region */
body {
width: 100%;
height: 100vh;
margin: 0;
background-color: #1b1b32;
color: #f5f6f7;
font-family: Tahoma;
font-size: 16px;
}
h1, p {
margin: 1em auto;
text-align: center;
}
form {
width: 60vw;
max-width: 500px;
min-width: 300px;
margin: 0 auto;
}
fieldset {
border: none;
padding: 2rem 0;
border-bottom: 3px solid #3b3b4f;
}
fieldset:last-of-type {
border-bottom: none;
}
label {
display: block;
margin: 0.5rem 0;
}
input, textarea, select {
margin: 10px 0 0 0;
width: 100%;
min-height: 2em;}
input,
texarea {
background-color: #0a0a23;
border: 1px solid #0a0a23;
color: #ffffff; }
.inline {
width: unset;
margin: 0 0.5em 0 0;
vertical-align: middle;
}
/* User Editable Region */
Your browser information:
User Agent is: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_6) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/15.6.1 Safari/605.1.15
Challenge: Learn HTML Forms by Building a Registration Form - Step 55
Link to the challenge:
It still does work. It’s still saying that I should remove min-height
You are making a bunch of style changes that can make it hard for the test suite to understand what you are doing. I would literally only move that one line and do nothing else.
I am not doing it on my own recognizance. The assignment/challenge asked me to make changes here and there, ad I obey.
You were not told to change this line.
You were not told to move this }
You were not told to move this }
Please don’t post a picture of your code.
It looks like you still made changes that were not requested.
you have a typo here
input,
texarea {
‘textarea’ not ‘texarea’
Gotta tell you, if you hadn’t modified anything except for the min-height line, this pain would have been avoided (I literally spent 15 minutes copying and pasting your code line by line to find this)
1 Like
Good catch.
I missed that when I first looked at it
1 Like
I didn’t modified any of it on purpose. The typo probably happened after I had tried and retried and of course typing and retyping the word (whenever the challenge says to remove or move this and that) BEFORE I came here to ask for help (after all I wanted to be able to fix my own problem, instead of having to disturb someone with it). I had already gone and reset the lesson and started over, and I found the answer. I am just now seeing your reply.
Anyway, thank you for finding the typo.
yeah resetting the lesson usually is the easiest way to get out of this type of thing if you are sure you have the correct code.
try to restart your browser. I’m not sure I’ve seen this issue before but maybe a restart will fix it.
This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.