Build a Checkout Page - Build a Checkout Page

HTML-CSS
1

Tell us what’s happening:

Hi,
I’m working on the project Build a checkout page and I keep on getting a error by question 12, it says “All of your input elements that aren’t a type of submit should have a label element associated with them.”
all my inputs have a label. please help.

Your code so far

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8" />
    <title>Checkout Page</title>
</head>

<body>
    <h1>Checkout</h1>
    <section>
        <h2>Your Cart</h2>
        <img src="https://cdn.freecodecamp.org/curriculum/labs/cube.jpg" alt="A colorful rubix cube, 18'." />
        <p>colorful rubix cube</p>
        <p>$15.35</p>
</section>
<section>
    <h2>Payment Information</h2>
<form>
     <div>
<label  for="card-name">Name (required):<span="*" aria-required="true">
<input id="card-name" name="card-name" type="text" required />
      </label>
      </div>
  
   <div>
   <label  for="phone number" >Phone Number (required):<span="*" aria-required="true"> 
   <input id="phone number" name="phone number" type="text" required />
   </label>
  </div>
<div>
<label for="address">Address>
<input id="address" name="address" type="text" />
</label>
</div>


<div>
<label for="postal-code">Postal Code>
<input id="postal-code" name="postal-code" type="text" size="7" />
</label>
</div>


<div>
<label for="country">Country> 
<select name="country" id="country">
    <option selected value="Canada">Canada</option>
    <option value="USA">U.S.A</option>
    <option value="Israel">Israel</option>
    <option value="England">England</option>
    </select>
   </label>
    </div>
    
<div>
<label for="card-number">Card Number (required):<span="*" aria-required="true">
<input required id="card-number" name="card-number" type="text" aria-describedby="card-number-help" id="card-number-help" required/>
<p aria-describedby id="card-number-help">Please enter your 16-digit card number</p>
</label>
</div>

<div>
<label for="cvv">CVV>
       <input id="cvv" name="cvv" type="text" size="5" />
</label>
</div>
    
    <div>
    <label for="exipry date">Expiry Date>
       <input id="expiry date" name="expiry date" type="text" placeholder="07/29" size="5"/>
       </label>
       </div>
      
      <input type="submit" id="submit" name="submit" placeholder="place-order"size="20" />
</form>
</section>

Your browser information:

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

Challenge Information:

Build a Checkout Page - Build a Checkout Page

https://www.freecodecamp.org/learn/full-stack-developer/lab-checkout-page/build-a-checkout-page

2

How many id and required attributes should an input element have?

Can an id attribute’s value contain spaces? What punctuation can you use instead?

3

Thanks for your help, When I remove one id and press test I get a error for question 16, 17 and 18

4

Please post your updated code if you need more help.