HTML/CSS confusion

Question

Currently studying computer science, but I've really only dealt with c++ & java. Currently trying to learn html & css, which is obviously not as difficult as having to write the code for a binary search tree which will balance itself after inserting data.

ANYWAYS!! I'm stuck! I dont understand why the .h css style in the following code isn't working on the contents of the div box!! Any help would be great.

<html>

<head>
<title>test</title>
<meta charset="UTF-8">
<style type=“text/css”>
.h {
    color: red;
    text-align: center;  
    }
</style>
</head>

<body>
<div class=“h”>Hello World</div>
</body>

</html>

This is obviously a very simple code of block, but the Hello World doesn't turn red. Would love to know what I am doing wrong.

THANK YOU!

P.S. I have tried checking the output on http://www.littlewebhut.com/html/ and nothing :(

The quote marks in your style and div tags are "smart-quotes" that don't match, not real quotes, blame your editor. — jmoerdyk
– jmoerdyk, Commented Jan 11, 2018 at 0:37
Thank you so much!! Another user pointed out the same! The smallest of issues always end up being the most difficult to figure out haha — Monica
– Monica, Commented Jan 11, 2018 at 0:43

nbkhope · Accepted Answer · 2018-01-11 00:40:52Z

3

You are using the wrong set of quotes for the class value.

“h” is different from "h"

This likely happened because of your text editor converting the plain quotes like " to the more fancy ones “ and ”

So to fix it, use:

<div class="h">Hello World</div>

The same goes for type=“text/css” but you don't need to specify this at all; only having <style> will suffice since CSS is the standard for stylesheets.

Make sure to disable smart quotes from your text editor!

edited Jan 11, 2018 at 0:40

answered Jan 11, 2018 at 0:36

nbkhope

7,5144 gold badges44 silver badges59 bronze badges

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

1 Comment

Monica Over a year ago

YOU ARE AMAZING!! That is exactly what was wrong! Thank you so much. I had been looking over this trying to understand why it wasn't working. Great eye! :) It truly always ends up being the simplest of issues.

Ronnie Smith · Accepted Answer · 2018-01-11 00:43:25Z

-1

CSS, while simple in appearance, can challenge one's mind. I see that your issue boiled down to unicode or smart quotes. Just an FYI, quotes are actually not necessary on classes applied to HTML elements.

.h {
    color: red;
    text-align: center;  
}

<html>

<head>
<title>test</title>
<meta charset="UTF-8">
</head>

<body>
<div class=h>Hello World</div>
</body>

</html>

edited Jan 11, 2018 at 0:43

answered Jan 11, 2018 at 0:40

Ronnie Smith

18.8k7 gold badges89 silver badges99 bronze badges

2 Comments

nbkhope Over a year ago

This answer is using smart quotes “h” for the class value. Plain quotes should be used "h".

Monica Over a year ago

This actually helped tremendously as well!! Thank you! I will rid my html div classes of quotes altogether to simplify!

Collectives™ on Stack Overflow

HTML/CSS confusion

2 Answers 2

1 Comment

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related