i think i am having an issue with my code i have been trying to figure out what i am getting wrong. i have an input type of checkbox.
<!-- 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>
<ul class="todo-list">
<input type="checkbox" id="explore">
<label for="explore">Explore</label>
<ul class="sub-item">
<li>
<a class="sub-item-link" href="https://submititem.com" target="_blank">Site</a>
</li>
</ul>
</li>
<li>
<input type="checkbox" id="report">
<label for="report">Report</label>
<ul class="sub-item">
<li>
<a class="sub-item-link" href="https://www.google.com" target="_blank">Access</a>
</li>
</ul>
</li>
<li>
<input type="checkbox" id="warranty">
<label for="warranty">Warranty</label>
<ul class="sub-item">
<li>
<a class="sub-item-link" href="https://www.operamini.com" target="_blank">Verify</a>
</li>
</ul>
</li>
<li>
<input type="checkbox" id="submit">
<label for="submit">Submit</label>
<ul class="sub-item">
<li>
<a class="sub-item-link" href="https://www.chrome.com" target="_blank">Click me</a>
</li>
</ul>
</li>
</ul>
</body>
</html>
/* file: styles.css */
body {
font-family: Arial, san-serif;
padding: 20px;
background-color: purple;
}
.sub-item-link {
text-decoration: none;
color: pink;
}
.sub-item-link:visited {
color: red;
}
.sub-item-link:hover {
color: blue;
}
.sub-item-link:focus {
outline: 3px solid green;
}
.sub-item-link:active{
color: yellow;
}
User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/138.0.0.0 Safari/537.36
Build a Stylized To-Do List - Build a Stylized To-Do list
ILM
August 5, 2025, 12:30pm
2
Here are some troubleshooting steps you can follow. Focus on one test at a time:
What is the requirement of the first failing test?
Check the related User Story and ensure it’s followed precisely.
What line of code implements this?
What is the result of the code and does it match the requirement?
Are there any errors or messages in the console?
If this does not help you solve the problem, please reply with answers to these questions.
all of you do not have any issue with the code just link the CSS with html in the head element
please i need help, i still do not know what i am doing wrong, i have been going through it for two days and everything looks good to me.
<!-- 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>
<ul class="todo-list">
<input type="checkbox" id="explore">
<label for="explore">Explore</label>
<ul class="sub-item">
<li>
<a class="sub-item-link" href="https://submititem.com" target="_blank">Site</a>
</li>
</ul>
</li>
<input type="checkbox" id="report">
<label for="report">Report</label>
<ul class="sub-item">
<li>
<a class="sub-item-link" href="https://www.google.com" target="_blank">Access</a>
</ul>
</li>
<input type="checkbox" id="warranty">
<label for="warranty">Warranty</label>
<ul class="sub-item">
<li>
<a class="sub-item-link" href="https://www.operamini.com" target="_blank">Verify</a>
</ul>
</li>
<input type="checkbox" id="submit">
<label for="submit">Submit</label>
<ul class="sub-item">
<li>
<a class="sub-item-link" href="https://www.chrome.com" target="_blank">Click me</a>
</ul>
</li>
</ul>
</body>
</html>
/* file: styles.css */
body {
font-family: Arial, san-serif;
padding: 20px;
background-color: purple;
}
.sub-item-link {
text-decoration: none;
color: pink;
}
.sub-item-link:visited {
color: red;
}
.sub-item-link:hover {
color: blue;
}
.sub-item-link:focus {
outline: 3px solid green;
}
.sub-item-link:active{
color: yellow;
}
User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/138.0.0.0 Safari/537.36
Build a Stylized To-Do List - Build a Stylized To-Do list
Please do not create duplicate topics for the same challenge/project question(s). If you need more help then respond back to the original topic you created with your follow up questions and/or your updated code and question.
Thank you.
you need to read the failed tests and understand what they are looking for in order to find your own mistakes.
You should have four list items inside the unordered list.
Do you know what this one is asking for?
<ul>
<li>pure</li>
<li>game</li>
<li>ball</li>
<li>code</li>
</ul>
I’ve edited your post to improve the readability of the code. When you enter a code block into a forum post, please precede it with a separate line of three backticks and follow it with a separate line of three backticks to make it easier to read.
You can also use the “preformatted text” tool in the editor (</>) to add backticks around text.
See this post to find the backtick on your keyboard.Note: Backticks (`) are not single quotes (').
1 Like
Great. Now in your code, do you have anything like this? Try to check and see.
yes, and i another ul element embedded inside. just for clarity, i have made some updated corrections on the code up there.
You need a ul element with four li elements inside.
If you have this in the code, copy it in your next reply to me and please indicate which line number this code starts on.
<ul class="todo-list">
<input type="checkbox" id="explore">
<label for="explore">Explore</label>
<ul class="sub-item">
<li>
<a class="sub-item-link" href="https://submititem.com" target="_blank">Site</a>
</li>
</ul>
</li>
<input type="checkbox" id="report">
<label for="report">Report</label>
<ul class="sub-item">
<li>
<a class="sub-item-link" href="https://www.google.com" target="_blank">Access</a>
</ul>
</li>
<input type="checkbox" id="warranty">
<label for="warranty">Warranty</label>
<ul class="sub-item">
<li>
<a class="sub-item-link" href="https://www.operamini.com" target="_blank">Verify</a>
</ul>
</li>
<input type="checkbox" id="submit">
<label for="submit">Submit</label>
<ul class="sub-item">
<li>
<a class="sub-item-link" href="https://www.chrome.com" target="_blank">Click me</a>
</ul>
</li>
</ul>
This code starts from line 10 on my code.
but here its the first line.
Which part is the ul that has four li inside it?
(If you want to nest a ul in a ul you have to put the nested ul inside an li)
1 Like
Things like this should either be moved outside the ul or moved inside a li
Thanks, i will try that now.
1 Like
