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

HTML-CSS
1

Tell us what’s happening:

No matter how hard I crosscheck, I can’t seem to find the reason my no 9, 10 & 14 is been marked wrong.
Please help me find my mistake

Your code so far

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

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

<body>
    <ul class="todo-list">
        <li> <input id="read-books" type="checkbox">
            <label for="read-books">Read my books</label></li>
        <ul class="sub-item">
            <li><a href="https://www.freecodecamp.org/learn" target="_blank" class="sub-item-link">books to read</a>
            </li>
        </ul>
    <li> <input id="study-bible" type="checkbox">
            <label for="study-bible">Study my bible</label></li>
        <ul class="sub-item">
            <li><a target="_blank"
             href="https://www.freecodecamp.org/learn/responsive-web-design-v9/lab-stylized-to-do-list/build-a-stylized-to-do-list"          class="sub-item-link">verse to study</a></li>
        </ul>
             <li> <input id="pray" type="checkbox">
            <label for="pray">Pray</label>
    
        <ul class="sub-item">
            <li><a href="https://www.freecodecamp.org/learn/responsive-web-design-v9/lab-stylized-to-do-list/build-a-stylized-to-do-list"
                    target="_blank" class="sub-item-link">what to pray about</a></li>
        </ul>
    <li><input id ="practice-web-development" type="checkbox">
            <label for="practice-web-development">Practice web development</label>
            <ul clas="sub-item">
                <li><a href="https://www.freecodecamp.org/learn/responsive-web-design-v9/lab-stylized-to-do-list/build-a-stylized-to-do-list"
                        target="_blank" class="sub-item-link">what to practice</a></li>
            </ul>
        
    </ul>

</body>

</html>

/* file: styles.css */
a:link{color: green;}
a:visited{color: red;} 
a:hover {color: blue;}
a:focus{outline: 2px solid black;}
a:active{color: purple;}
a:{text-decoration: none;}

Your browser information:

User Agent is: Mozilla/5.0 (Linux; Android 10; K) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/145.0.0.0 Mobile Safari/537.36

Challenge Information:

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

2

Welcome to the forum @Mma605

You have a typo.

Each sub unordered list need to go in the parent list item element.

Happy coding

3

Wow!

Thank you very much, I did exactly what you said and my no 9&10 was marked right

I’ve also gotten my no 14

Thank you

1 Like