Tell us what’s happening:
I can’t get test 18 which is asking for me to change the outline color of links when they are focussed
Your code so far
<!-- file: index.html -->
<!DOCTYPE html>
<html lang="en">
<head>
<link rel="stylesheet" href="styles.css">
<meta charset="utf-8">
<title>Styled To-Do List</title>
</head>
<body>
<ul class="todo-list">
<li>
<input type="checkbox" id="coding-course">
<label for="coding-course">Coding course</label>
<ul class="sub-item">
<li>
<a class="sub-item-link" href="https://www.freecodecamp.org/learn/responsive-web-design-v9/#lecture-styling-lists-and-links" target="_blank">FreeCodeCamp.org</a>
</li>
</ul>
</li>
<li>
<input type="checkbox" id="renovate-house">
<label for="renovate-house">Renovate House</label>
<ul class="sub-item">
<li>
<a class="sub-item-link" href="https://www.freecodecamp.org/learn/responsive-web-design-v9/#lecture-styling-lists-and-links" target="_blank">Wallmart</a>
</li>
</ul>
</li>
<li>
<input type="checkbox" id="save-money">
<label for="save-money">Save Money</label>
<ul class="sub-item">
<li>
<a class="sub-item-link" href="https://www.freecodecamp.org/learn/responsive-web-design-v9/#lecture-styling-lists-and-links" target="_blank">Loyd's Bank</a>
</li>
</ul>
</li>
<li>
<input type="checkbox" id="exercise">
<label for="exercise">Exercise</label>
<ul class="sub-item">
<li>
<a class="sub-item-link" href="https://www.freecodecamp.org/learn/responsive-web-design-v9/#lecture-styling-lists-and-links" target="_blank">Gym</a>
</li>
</ul>
</li>
</body>
</html>
/* file: styles.css */
a {
text-decoration: none;
}
a:link {
color: red;
}
a:visited {
color: purple;
}
a:hover {
color: orange;
}
a:active {
color: blue
}
/*This is the brocken part according to the tests*/
a:focus {
outline-color: red;
}
Your browser information:
User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/143.0.0.0 Safari/537.36 Edg/143.0.0.0
Challenge Information:
Build a Stylized To-Do List - Build a Stylized To-Do list