CODEWITHSUNDEEP
htmlcss
Monica
Monica

Reputation: 13

HTML/CSS confusion

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 :(

Upvotes: 1

Views: 214

Answers (2)

Ronnie Smith
Ronnie Smith

Reputation: 18555

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>

Upvotes: -1

nbkhope
nbkhope

Reputation: 7474

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!

Upvotes: 3

Related Questions