Trying to set up a html file to practice, but CSS is ignored?

HTML-CSS
1

I have finished the HTML/CSS part, and try to set up something to try and practice what was in the lessons. But I can’t get it working…
I use TextEdit on Mac as my editor, and use Chrome to check. The html output is shown, but the CSS is ignored.
What am I doing wrong?

Here is the code:

<!DOCTYPE html>
<head>
<style type=“text/css”>
.container {
	border: 1px solid red;
	background: green;
}

.box-1 { 
	color: red; 
	border: 1px solid blue;
}
</style>
</head>
<body>

<div class=“container”>
	<div class=“box-1”>Box 1</div>
	<div class=“box-2”>Box 2 </div>
	<div class=”box-2”>Box 3</div>
</div>

</body>
</html>
2

I’ve edited your post for readability. When you enter a code block into a forum post, please precede it with a separate line of three backticks and follow it with a separate line of three backticks to make easier to read.

See this post to find the backtick on your keyboard. The “preformatted text” tool in the editor (</>) will also add backticks around text.

Note: Backticks are not single quotes.

markdown_Forums

3

If you look at the quote marks around your class names in the HTML, you’ll see that they are weird curly ones. Apple does this thing automatically called ‘smart quotes’ or ‘pretty quotes’ or something. You need to turn them off.

4

Brilliant, thank you! Also thanks about how to post code.
However, it still does not do the CSS rules, and I have turned off smart quotes.

5

When I replace all the Apple quotes with normal quotes, your CSS is working.

image
image799×103 797 Bytes

6

Thank you very much, that was a big help. Would never have thought myself that it could be the quotes! I had another go at playing with them, and everything is fine now, I can finally start practising!

For campers who might have the same problem:
Apple menu -> System Preferences -> Keybord ->Text.
UNcheck “Use smart quotes and dashes”. Also, from the option list select the least fancy double and single quotes - in my list that was the last option in the list.