通过编写注册表单学习 HTML 表单 - Step 41 (此问题已解决)

告诉我们发生了什么:
在此详细描述你的问题。

Is it the browser? Or do I understand + grammar mistakes?
I did it the way everyone else did it, but I was still wrong :rofl: :sob: :cold_face:

  **你目前的代码**
/* 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 action='https://register-demo.freecodecamp.org'>
    <fieldset>
      <label>Enter Your First Name: <input type="text" name="first-name" required /></label>
      <label>Enter Your Last Name: <input type="text" name="last-name" required /></label>
      <label>Enter Your Email: <input type="email" name="email" required /></label>
      <label>Create a New Password: <input type="password" name="password" pattern="[a-z0-5]{8,}" required /></label>
    </fieldset>
    <fieldset>
      <label><input type="radio" name="account-type" /> Personal Account</label>
      <label><input type="radio" name="account-type" /> Business Account</label>
      <label>
        <input type="checkbox" name="terms" required /> I accept the <a href="https://www.freecodecamp.org/news/terms-of-service/">terms and conditions</a>
      </label>
    </fieldset>
    <fieldset>
      <label>Upload a profile picture: <input type="file" name="file" /></label>
      <label>Input your age (years): <input type="number" name="age" min="13" max="120" />
      </label>
      <label>How did you hear about us?
        <select 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>Provide a bio:
        <textarea 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 */
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:0;
border-left:0;
border-right:0;
padding-top: 2rem;
padding-bottom: 2rem; 
}

label {
display: block;
margin: 0.5rem 0;
}

  **你的浏览器信息:**

用户代理是: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/15.6 Safari/605.1.15

挑战: 通过编写注册表单学习 HTML 表单 - Step 41

挑战的链接:

It is asking you to remove the left/right padding. You can set it all in one line using the padding shorthand.

Syntax:

padding: top/botton right/left;

Example:

padding: 10px 0;

hi ,still won`t do



题干的要求是将fieldest的border,padding-left,padding-right移除并设置padding-top,padding-bottom的值为2rem。
如果你打算使用完整写法只需把图3的padding-left和padding-right改成0,并把padding移除即可。
如果你打算使用简写形式,则需了解padding值分别为一个参数,两个参数,三个参数,四个参数时的含义。

//当padding属性值只有一个时,它代表盒模型上/右/下/左四个内边距
fieldest {
  padding: 2rem;
}
等同于
fieldest {
  padding-top: 2rem;
  padding-right: 2rem;
  padding-bottom: 2rem;
  padding-left: 2rem;
}

//当padding属性值有两个时,它分别代表盒模型上/下、左/右四个内边距
fieldest {
  padding: 1rem 2rem;
}
等同于
fieldest {
  padding-top: 1rem;
  padding-bottom: 1rem;
  padding-left: 2rem;
  padding-right: 2rem;
}

//当padding属性值有三个时,它分别代表盒模型上、左/右、下四个内边距
fieldest {
  padding: 1rem 2rem 3rem;
}
等同于
fieldest {
  padding-top: 1rem;
  padding-left: 2rem;
  padding-right: 2rem;
  padding-bottom: 3rem;
}

//当padding属性值有四个时,它分别代表盒模型上、右、下、左四个内边距
fieldest {
  padding: 1rem 2rem 3rem 4rem;
}
等同于
fieldest {
  padding-top: 1rem;
  padding-right: 2rem;
  padding-bottom: 3rem;
  padding-left: 4rem;
}


:sob: :sob: :sob: :sob: 我是个loser

对于padding来说显然none并不是个有效的值,请使用0来代替none。

我换成0了,但是还是和上图一样报错 :joy: :rofl:


选择器不对(你应该更细心一点 :rofl:

啊啊啊啊啊 天那 还真的是 我快要裂开 :rofl: