Referencing a CSS Class

Question

So I'm writing a css file to manipulate my navigation bar. The HTML code is as such:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">

<html>
<head>
<title>Designs by Dante</title>
<link rel="stylesheet" type="text/css" href="style.css"   />
</head>

<body>

<h2>Designs by Dante</h2>

<ul id=“navigation”>
<li><a href="www.designsByDante.com/homepage.html">Home</a></li>
<li><a href="www.designsByDante.com/about.html">About</a></li>
<li><a href="www.designsByDante.com/services.html">Services</a></li>
<li><a href="www.designsByDante.com/portfolio.html">Portfolio</a></li>
<li><a href="www.designsByDante.com/contact.html">Contact</a></li>
</ul>

</body>

</html>

Pretty simple. I made my unordered list with the class of navigation so I can manipulate it the same across all five webpages.

However, I created a style.css file in the exact same folder as the five .html files and it doesn't draw from that whatsoever. Well, almost.

Here's the CSS file code:

#navigation
{
margin:50px;
padding:0;
list-style:none;
width:525px; 
}

I know you have to draw from the .css file using the attribute within the HTML but is there something in the .css file to make it recognizable by the HTML other than just naming it correctly and linking it?

I played around with this and I'm positive it isn't the .css file. The reason for that conclusion is because I changed #navigation on the .css file to ul and presto...it worked.

Next step was to make sure I was writing it correctly which, given the above code, I think is correct. I researched CSS heavily last night because my previous question was admittedly done with no previous research. But I am truly stuck and would love someone to enlighten me as to what I'm doing wrong. I'm going to continue going through the w3schools.com website for now. Thank you for taking the time to read this message!

Check the funky quotes in <ul id=“navigation”> if that's in your actual source you should fix that. — j08691
– j08691, Commented Feb 7, 2014 at 21:53

Quentin · Accepted Answer · 2020-11-16 09:58:09Z

2

You are using LEFT DOUBLE QUOTATION MARK (“) and RIGHT DOUBLE QUOTATION MARK (”) where you should be using QUOTATION MARK (") (or APOSTROPHE (')) around your id attribute value.

Since those are not valid delimiters for an attribute value, they are treated as part of the id.

When this answer was originally written, this would have been picked up by a validator. IDs including those characters are valid in HTML 5 so that is no longer the case.

edited Nov 16, 2020 at 9:58

answered Feb 7, 2014 at 21:55

Quentin

949k136 gold badges1.3k silver badges1.4k bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

danteMingione Over a year ago

Omg thank you. I recently bought a MacBook Pro so I used TextEdit (Standard program like a crappy Notepad) but switched to TextWrangler and I just had to reenter the quotes. Thank you so much.

Quentin Over a year ago

TextEdit is more of a WordPad than a Notepad. It is a word processor not a text editor. TextWrangler is a capable editor. Sublime Text is the flavour of the month in editors.

Collectives™ on Stack Overflow

Referencing a CSS Class

1 Answer 1

2 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related