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

HTML-CSS
1

Tell us what’s happening:

I can’t get the css part right but the html is okay on my end

Your code so far

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

<head>
    <meta charset="utf-8">
    <title>Styled To-Do List</title>
</head>

<body>
    <ul class="todo-list">
        <li>
            <input type="checkbox" id="Task-1">
            <label for="Task-1">Task 1</label>
            <ul class="sub-item">
                <li>
                    <a class="sub-item-link"       href="https://gemini.google.com/app" target="_blank">List example 1</a>
                </li>
           </ul>
         </li>
         <li>
             <input type="checkbox" id="Task-2">
            <label for="Task-2">Task 2</label>
            <ul class="sub-item"><li><a class="sub-item-link" href="https://gemini.google.com/app" target="_blank">List example 2</a></li></ul>  
        </li>
        <li><input type="checkbox" id="Task-3">
            <label for="Task-3">Task 3</label>
            <ul class="sub-item"><li><a class="sub-item-link" href="https://gemini.google.com/app" target="_blank">List Example 3</a></li></ul></li>
       <li> <input type="checkbox" id="Task-4">
            <label for="Task-4">Task 4</label>
            <ul class="sub-item"><li><a class="sub-item-link" href="https://gemini.google.com/app" target="_blank">List Example 4</a></li></ul></li>

    </ul>
</body>

</html>

/* file: styles.css */
/* file: styles.css */
body{
  margin: 100px;
  background-color: pink;
}
.sub-item{
  text-decoration: none;
}
.sub-item-link{
  text-decoration: none;
}
.todo-list{background-color: white;
  color: green;

  padding: 100px;
  margin-top: 15px;
  margin-right: 15px;
  
}
ul,li{
  background-color: pink
}
a{
  text-decoration: none;

}
a:visited{color: black;

}
a:hover{color: purple;

}
a:active{color: red;

}
a:focus{ 
  outline: 3px black;
}

Your browser information:

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

Challenge Information:

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

2

did you link the CSS file?

3

Hey buddy, Here in this section of code you need to add something in order to connect your css in your html file

<head>
    <meta charset="utf-8">
    <title>Styled To-Do List</title>
</head>

Hope You Know what to add in this section…