Build a Stylized To-Do List - Build a Stylized To-Do list

HTML-CSS
1

Tell us what’s happening:

. The li inside the ul with the class todo-list should contain an input element with the type of checkbox.
Failed:4. The li inside the ul with the class todo-list should contain a label element.

anyone can help me

Your code so far

<!-- file: index.html -->
<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="utf-8">
    <title>Styled To-Do List</title>
     <link rel="stylesheet" href="styles.css">



</head>

<body>
    <div class="main">
        <h1>My Todo-List</h1>
        <div>
    <ul class="todo-list">
       <div class="s">
           <li>
              <input type="checkbox" id=
              "anatomy">
              <label for="anatomy">Anatomy</label>
              <ul class="sub-item">
                  <li>
                      <a class="sub-item-link" href="google.com" target="_blank">Upper Limb</a>
                      </li>
                      </div>
                      </ul>
                      

      <div id="a"> 
           <li>
                <input type="checkbox" id="grays anatomy" i>
                <label for="grays anatomy">Grays Anatomy</label>
                <ul class="sub-item">
                    <li>
                        <a class="sub-item-link" href="google.com" target="_blank">Pectoral Region</a>
                    </li>
                    </div>
                    </ul>

        <div id="d">
            <li>
            <input type="checkbox" id="nettler">
            <label for="nettler">Nettler</label>
            <ul class="sub-item">
                <li>
                    <a class="sub-item-link" href="google.com" target="_blank">Pelvic</a>
                    </li>
            </div>        </ul>

      <div class="f">   <li>
             <input type="checkbox" id="biomechanics">
             <label for="biomechanics">Biomechanics</label>
             <ul class="sub-item">
                 <li>
                     <a class="sub-item-link" href="google.com" target="_blank">Tendon</a>
                     </li>
                  </div>   </ul>                         
                       
        

</body>

</html>

/* file: styles.css */
a{text-decoration: none;}
 
 .main {
  width: 80%;
  background-color: burlywood;
  margin-left: auto;
  margin-right: auto;
  margin-top:50px;
  padding: 30px;
  max-width: 500px;
   border: solid 3px black;
    border-radius: 10px;
 }

 body{
   background:blue;
   font-family:arial;
 }
 .s{background-color:white;
    border: solid 3px blue;
    border-radius:10px;
    marign-bottom:20px;
 }

 #a{background-color:white;
    border: solid 3px blue;
    border-radius:10px;
    margin-bottom:20px}
    
 #d{background-color:white;
    border: solid 3px blue;
    border-radius:10px;
    margin-bottom:20px;
    }   

 .f{background-color:white;
    border: solid 3px blue;
    border-radius:10px;
    margin-bottom:20px;}   

.sub-item-link:visited{color:red}

sub-item-link:hover{color:purple}

sub-item-link:focus{color:skyblue}

sub-item-link:focus{color:yellow;}

Your browser information:

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

Challenge Information:

Build a Stylized To-Do List - Build a Stylized To-Do list

2

Hi @saikumar98942

You should have four li elements and one ul element, not four ul elements.

Happy coding