Tell us what’s happening:
I keep getting the message:
22. Your Technical Documentation project should use at least one media query.
I have already added one though.
What do I do?
My code so far
<!-- file: index.html -->
<!doctype html>
<html>
<head>
</head>
<body>
<main id="main-doc">
<header>Cats: The furry friends</header>
<section class="main-section" id="Introduction">
<header>Introduction</header>
<p>Cats are fluffy mammals that are loving, sweet and very very fun. They are one of the most popular pets, and there's a reason for that. They are caring and they are warm and cuddly.</p>
<p>Their scientific name is Felis Catus, which is quite self-explanatory. They evolved from toothy, large predators in the Pleistocene, to small, cuddly, furry and warm pets in our homes.</p>
<code></code>
<li></li>
</section>
<section class="main-section" id="Why_should_you_have_one?">
<header>Why should you have one?</header>
<p>Having a cat can really help. For example, when you are upset or not happy, a cat can help you feel better! They can also make you feel less lonely if you are living by yourself.</p>
<p>Cats can really make you smile! Having a cat is nice when you are in bed, because you can sleep with it. Just don't let it pooh on you in your sleep.</p>
<code></code>
<li></li>
</section>
<section class="main-section" id="Duties_and_responsibility">
<header>Duties and responsibility</header>
<p>When you have a cat, you have many responsibilities. For example, you have to look after after the cat. This includes cleaning its pooh, giving it a clean litter box and feeding it.</p>
<p>If you have a longhair, you will have to clean up all the fur. Many cats will also leave hairballs. Some cats might pooh in your house, so mind that too.</p>
<code></code>
<li></li>
</section>
<section class="main-section" id="How_to_choose_a_cat">
<header>How to choose a cat</header>
<p>If you want a cat, you have to know which type. For example, do you want an indoor or outdoor cat? Choosing if you want a clingy, attention seeker or an independent cat can help if you aren't at home often.</p>
<p>Next, choose if you want a longhair or shorthair. Choosing this can affect hor often you have to clean your house, as longhairs often shed. If you like, choose female or male, and also which colour. If you don't mind, you don't have to.</p>
<code></code>
<li></li>
</section>
<section class="main-section" id="Final_tips">
<header>Final tips</header>
<p>Here are some final tips. First, never hold a cat by its tail. Second, don't dress it up. This can cause itchyness or uncomfort.</p>
<p>Third, make sure you give your cat a good amount of food a day, maybe a handfull of food in the morning and night. Fourth, make sure your cat has a good drinking supply. For example, a fish tank with running water, or a small stream.</p>
<code></code>
<li></li>
</section>
<nav id="navbar">
<header>Getting a cat</header>
<ul>
<li>
<a class="nav-link" href="#Introduction">Introduction</a>
</li>
<li>
<a class="nav-link" href="#Why_should_you_have_one?">Why should you have one?</a>
</li>
<li>
<a class="nav-link" href="#Duties_and_responsibility">Duties and responsibility</a>
</li>
<li>
<a class="nav-link" href="#How_to_choose_a_cat">How to choose a cat</a>
</li>
<li>
<a class="nav-link" href="#Final_tips">Final tips</a>
</li>
</ul>
</nav>
</main>
</body>
</html>
/* file: styles.css */
@media (max-width: 300px) {
.nav-link {
margin: 10px;
}
}
My 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 Edg/136.0.0.0
Challenge Information:
Technical Documentation Page - Build a Technical Documentation Page