my html is not linking with my css on chrome os

my code is not linking with my css

<!DOCTYPE html>
<html>
<head>
    <link href="main.css" rel="slylesheet" text="text/css">
<title></title>
</head>
<body>
    <header>
        <div class="container">
            <img src="beens.jpg" alt="logo" class="logo">
            <nav>
                <ul>
                    <li><a href="#">about</a></li>
                    <li><a href="#">games</a></li>
                    <li><a href="#">contact</a></li>
                    <li><a href="#">blog</a></li>
                </ul>
            </nav>
        </div>
        
    </header>
</body>
</html>

it worked on my flash drive but not localy

.container {
    width: 80%;
    margin: 0 auto;
}
.header {
    background: rgb(51, 146, 153);
}
li {
  color: rgb(142, 15, 15);
}

my background is still white plz help

i tryed rewriting my link code and checking here

Solution

You have a typo here: <link href="main.css" rel="slylesheet" text="text/css">

It is supposed to be stylesheet

Also you are calling your header as a class .header But since you didnt give it a class and want to call the tag you need to set it to

header {
    background: rgb(51, 146, 153);
}