How do I get my CSS to reflect on my hdml webpage

Question

0.00/5 (No votes)

See more:

This is my very first time working with html and css and I can't get my css to reflect on my html page. I have tried putting in many different things into my css and none is reflected on the webpage. Help would be greatly appreciated.

This is my html (document is titled index.html)

<!doctype html>
<html>
<head>
<title>Jacob McCullough</title>
<meta "charset=utf-8">
<link rel="stylesheet" type="text/css" href="style.css" />
</head>
<body>
<header><h2>06-Jacob McCullough</h2></header>
<h3>Jacob McCullough</h3>
<main>
<article>
<h4>Current</h4>
<p>I am a senior and will hopefully be graduating this spring
with a BS in computer science.</p>
<h4>Background</h4>
<p>I am from Chillicothe, Missouri where I lived from the age of 7.
I previously attended the Grand River Technical School
in Chillicothe, where I received a TestOut Pro certification
as a PC technician. I then attended North Central Missouri College
in Trenton, Missouri where I attended for 2 years.
After graduating from NCMC I began attending Northwest,
where I have been attending for the last few years.
</p>
<h4>Plans</h4>
<p>I am interested in possibly becoming a network administrator.
When I graduate I hope to find a decent job
and make a decent living. </p>
<h4>Schedule</h4>
<p>Developing Web Applications and Services<br>
Software Engineering Principles<br>
Operating Systems<br>
Theory and Implementation of Programming Languages<br>
Mobile Computing-Android
</p>
</article>
<aside>
<h5>Another Jacob McCullough Fact</h5>
<p>Jacob was born in Jonesboro, Arkansas</p>
</aside>
</main>
<footer>
<p> This is information about the author of this page, Jacob McCullough</p>
</footer>
</body>
</html>

This is my css that I can't get to show up on my webpage. (document is titled style.cs
#header{
background-color: #66CCFF;

}

What I have tried:

This is my css that I can't get to show up on my webpage. (document is titled style.css)

#header{
background-color: #66CCFF;

}

Another thing I tried

body {
background: #fff;
font: .74em "Trebuchet MS" Verdana, Arial, sans-serif;
line-height: 1.5em;
}

Posted 7-Sep-18 21:24pm

Member 13977214

Updated 8-Sep-18 1:56am

Add a Solution

Comments

Member 10371658 8-Sep-18 4:02am

make sure your html page and css file on the same location(if not then pass the correct href of css file in html file).

1 solution

Add a Solution

Add your solution here

Treat my content as plain text, not as HTML

Preview 0

…

Existing Members

Sign in to your account

...or Join us

Download, Vote, Comment, Publish.

Your Email
Password
Forgot your password?

Your Email
This email is in use. Do you need your password?
Optional Password

I have read and agree to the Terms of Service and Privacy Policy
Please subscribe me to the CodeProject newsletters

When answering a question please:

Read the question carefully.
Understand that English isn't everyone's first language so be lenient of bad spelling and grammar.
If a question is poorly phrased then either ask for clarification, ignore it, or edit the question and fix the problem. Insults are not welcome.
Don't tell someone to read the manual. Chances are they have and don't get it. Provide an answer or move on to the next question.

Let's work to help developers, not make them feel stupid.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

Peter Leow · Accepted Answer · 2018-09-08T01:57:00

Solution 1

Assuming the html and css are in the same folder, then the problem is the selector:
Do you know what the

#header

refers to?
Remove the # sign and see for yourself, i.e.

header{
    background-color: #66CCFF;
}

Spend a bit of time to learn the CSS selectors CSS Selectors Reference[^]

Posted 8-Sep-18 1:57am

Peter Leow

Comments

Member 13977214 8-Sep-18 12:36pm

Thank you very much. That was the problem, I took the '#' out and it worked immediately.