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

HTML-CSS
1

Tell us what’s happening:

I tried everything, and it still does not work. Even AI says that my code is correct, and the validator also.

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="stylesheet.css">
</head>

<body>
<h1>My Todo List</h1>
    <ul class="todo-list">
        <li> 
            <input type="checkbox" id="one"><label for="one">step one</label>
            <ul class="sub-item">
                <li><a class="sub-item-link" href="www.example.com" target="_blank">Work</a></li>
            </ul>
        </li>
        <li> 
            <input type="checkbox" id="two"><label for="two">step two</label>
            <ul class="sub-item">
                <li><a class="sub-item-link" href="www.example.com" target="_blank">Eat</a></li>
            </ul>
        </li>
        <li> 
            <input type="checkbox" id="three"><label for="three">step three</label>
            <ul class="sub-item">
                <li><a class="sub-item-link" href="www.example.com" target="_blank">Sleep</a></li>
            </ul>
        </li>
        <li> 
            <input type="checkbox" id="four"><label for="four">step four</label>
            <ul class="sub-item">
                <li><a class="sub-item-link" href="www.example.com" target="_blank">Reapet</a></li>
            </ul>
        </li>
    </ul>
</body>
</html>

/* file: styles.css */
ul {
  list-style: none;    
  padding: 0;
  margin: 0;
}
.sub-item {
  border: 1px solid #333;
}
.sub-item-link {
  text-decoration: none;
  outline: none;
  color: black;
}
.sub-item-link:hover {
  color: red;
}
.sub-item-link:active {
  color: blue;
}
.sub-item-link:focus {
  outline: 2px dashed #000;
  }
.sub-item-link:visited {
  color: purple;
}

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

what tests are you failing? and how do you think your code satisfies that?

3

Failed:14. The links on the page should have no underline by default.

Failed:15. The links should change color when hovered over.

Failed:16. The links should change color when they are being clicked.

Failed:17. The links should have an outline when focused.

  • Failed:18. The links should change color once visited.
4

you missed the second question, please indicate which parts of the code you think satisfy these tests