Help
cancel
Showing results for 
Search instead for 
Did you mean: 
Highlighted
Copilot Lvl 2
Message 1 of 4

Css style sheet will not link with HTML page.

Solved! Go to Solution.

Hello,i am creating a website. I have already created my home page and i had no problem linking my home page html page with my css style sheet but i am having a problem linking my second html page with my css style sheet. By the way i have different css style sheet for different html page. Am i missing something?

 

<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="utf-8">
<title>AfroChic</title>
<link href="https://fonts.googleapis.com/css?family=Lobster" rel="stylesheet">
<link rel="stylesheet" href="blog/style.css">
</head>
<body>

<nav class="navbar">
<span class="open-slide">
<a href="#" onclick="openSlideMenu()">
<svg width="30" height="30">
<path d="M0,5 30,5" stroke="#F76C6C"
stroke-width="5"/>
<path d="M0,14 30,14" stroke="#F76C6C"
stroke-width="5"/>
<path d="M0,23 30,23" stroke="#F76C6C"
stroke-width="5"/>
</svg>
</a>
</span>

<ul class="navbar-nav">
<li><a href="index.html">Home</a></li>
<li><a href="html/hair.html">Hair</a></li>
<li><a href="html/makeup.html">Make up</a></li>
<li><a href="html/skincare.html">Skin Care</a></li>
<li><a href="html/blog.html">Blog</a></li>
</ul>

 

</nav>

<div id="side-menu" class="side-nav">
<a href="#" class="btn-close"
onclick="closeSlideMenu()">&times;</a>
<a href="#">Home</a>
<a href="#">Hair</a>
<a href="#">Make up</a>
<a href="#">Skin Care</a>
<a href="#">Blog</a>
<a href="#">Contact</a>
</div>

<div id="main">
<h1></h1>
</div>

<div id="name">
<h1>AfroChic</h1>
</div>
<div id="logo">
<img src="images/afrochic.png">
</div>

 

 

 

 

 

 

 

 


<div id="container">
<div id="main">

</div>

</div>

<footer>
<div class="wrapper">
<nav>
<ul >
<li><a href="#">Home</a></li>
<li><a href="#">Hair</a></li>
<li><a href="#">Make up</a></li>
<li><a href="#">Skin Care</a></li>
<li><a href="#">Blog</a></li>
<li><a href="#">Contact</a></li>
</ul>

</nav>

</div>

</footer>


<script>
function openSlideMenu(){
document.getElementById('side-menu').style.width
= '250px';
document.getElementById('main').style.marginLeft
= '250px';
}

function closeSlideMenu(){
document.getElementById('side-menu').style.width
= '0px';
document.getElementById('main').style.marginLeft
= '0px';
}

</script>
</body>
</html>

3 Replies
Ground Controller Lvl 1
Message 2 of 4

Re: Css style sheet will not link with HTML page.

If the CSS isn't linked you just might've not saved the HTML file or made a typo in the file name

Commander Lvl 2
Message 3 of 4

Re: Css style sheet will not link with HTML page.

Welcome @n-adeoye to the GitHub Community Forum! First off all, you might want to consider posting just the relevant code and put it in a code block next time. That makes it a bit easier for all of us to assist you.

 

Furthermore, I would love to know if you've already checked what @dakkacoder suggested, and if you've looked in your developer consoler (usually F12) for any errors.


- Mark
Solution
Copilot Lvl 2
Message 4 of 4

Re: Css style sheet will not link with HTML page.

Thank you, I figured it out. It should have been ../hair/hair.css.