Can't get my CSS code to register with my index.html file

Hey guys, I am trying to experiment with web designing but I have ran into trouble. I have made a index.html file that was saved to my folder for the website using notepad++. I have also made another file called ccs file.ccs and saved it to the same folder. However when i open my index.html with google chrome I get just the boring text from index.html and none of the styling i coded for in the CCS file. I have included the standard:

<link type="text/css" rel="stylesheet" href="stylesheet.css">

However it hasn’t seemed to fix the issue. I know i am most likely forgetting something stupid but what am i doing something wrong.

Thanks in advance.

So this is supposed to be the name of you css document.

Also it should be file.css not .ccs

I just found that out before that it should be the name of my document. Now that I have fixed that it still doesn’t show my code for CSS.

body {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 15px;
	line-height: 1.5;
	padding: 0;
	margin: 0;
	background-color: #f4f4f4;
	}

/*global*/
.container{
	width: 80%;
	margin:auto;
	overflow: hidden;
	}
/*header*/
header{
	background-color: #35424a;
	color: #ffffff;
	padding-top: 30px;
	min-height: 70px;
	border-bottom: #e8491d 3px solid;
	}

header a{
	color: #ffffff;
	text-decoration: none;
	text-transform: uppercase;
	font-size: 16px;
	}
	
header ul{
	margin: 0;
	padding: 0;
}

header li{
	float:left;
	display: inline;
	padding-bottom: 0;
	padding-top: 0;
	padding-left: 20px;
	padding-right: 20px;
}

Can I see the updated link?

This is my index.html

<!DOCTYPE html> 
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<meta name="description" content="X and Y">
<title>Project X</title>
<link type="text/css" rel="stylesheet" href="style css.css">
</head>
<body>
<header>
<div class="container">
<div id="branding">
	<h1>Project X</h1>
</div>
<nav>
	<ul>
		<li><a href="index.html">Home</a></li>
		<li><a href="about.html">About</a></li>
		<li><a href="services.html">Services</a></li>
	</ul>
</nav>
</div>
</header>
<section id="showcase">'
	<div class="container">
	<h1>Project X</h1>
	<p>Project X allows you to enjoy</p>
</section>
<section id="subscribe">
<div class="container">
<h1>Project X subscription<h1>
<form>
	<input type="email" placeholder="Enter email">
	<button type="Submit"class="button_1">Subscribe</button>
</form>
</div>
</section>

<section id="boxes">
	<div class="container">
	<div class="box">
	<img src="http://rukkle.com/wp-content/uploads/project-x-movie-620X400.jpg">
	<h3>Project X</h3>
	<p>It's Project X</p>
	</div>
	</div>
</section>

<footer>
	<p>Project X Copyright &copy; 2017</p>
</footer>
</body>
</html>

Is this the exact name of your css document?

Yes, i changed it just then to say stylecss.css and changed the saved file to stylecss.css without any success.

Is it located in the same folder as the html document? You may have to write the pathway to the css document.

Yes so i named my folder “project x”

-Then using notepad++ i made a new file and added code, then saved it to the project X file under the name index.html
-Then using notepad++ I made a new file and added code, then saved it to the project X file under the name stylecss.css

Both are located in the same file. I am using windows 10 if that helps.

Just found the reason. I forgot to close one of my divs off. Thanks for the help though.

This topic was automatically closed 7 days after the last reply. New replies are no longer allowed.