The h1 should be navy, but it stays gray.
What to build
A corrected stylesheet.
Requirements
- The
h1isnavy. - All
h2elements areteal.
Constraints
Do not use !important, and do not change the HTML.
Example
h1.title scores higher than .title, because it adds one type selector.
Why it works
You either need a stronger selector, or you can remove the conflict altogether.
Hints
Hint 1
The class rule is stronger than the type rule, wherever it appears.
Hint 2
To make the second rule win, it must be more specific or the first must go.
Solution
Show one correct solution (try it yourself first)
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Cascade</title>
<style>
h1.title { color: navy; }
h2 { color: teal; }
</style>
</head>
<body>
<h1 class="title">Welcome</h1>
<h2>News</h2>
<h2 class="sub">Events</h2>
</body>
</html>