CODEWITHSUNDEEP
css
wide_eyed_pupil
wide_eyed_pupil

Reputation: 3451

Why won't my CSS class apply to <p> or <span> tags?

Why doesn't the 'test' class apply on usage at both the <p> tag and the <span> tag?

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
    <head>
        <meta content="text/html; charset=utf-8" http-equiv="Content-Type" />   
        <title>Newsletter template</title>
        <!--general stylesheet-->
        <style type="text/css">
            p { padding: 0; margin: 0; }
            a {
                color: #455670; text-decoration: underline;
            }
            test {
                margin: 20; font-family: "Helvetica Neue"; font-size: 20px; font-weight: normal; color: #666666; line-height: 15px !important;
            }
        </style>
    </head>
    <body>
        <p class="test"><span class="test"> Check the spelling of the words you typed.</span></p>
    </body>
</html>

Upvotes: 3

Views: 4971

Answers (6)

Rajesh Shrestha
Rajesh Shrestha

Reputation: 107

use .test instead of test in style. use 0px in padding,margin instead of 0. :)

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
        <head>
            <meta content="text/html; charset=utf-8" http-equiv="Content-Type" />   
            <title>Newsletter template</title>
            <!--general stylesheet-->
            <style type="text/css">
                p { padding: 0px; margin: 0px; }
                a {
                    color: #455670; text-decoration: underline;
                }
                .test {
                    margin: 20px; font-family: "Helvetica Neue"; font-size: 20px; font-weight: normal; color: #666666; line-height: 15px !important;
                }
            </style>
        </head>
        <body>
            <p class="test"><span class="test"> Check the spelling of the words you typed.</span></p>
        </body>
    </html>

Upvotes: 1

Steve Wellens
Steve Wellens

Reputation: 20638

If you have feedback on the site, use the meta menu option at the top of the page.

Upvotes: 1

Val
Val

Reputation: 2323

In CSS, to select an element by its class, you need to prefix the classname with a . As you have it, 

test {
    margin: 20;...
}

expects to see an HTML element named test -- but there is no such element. Change your selector to 

.test { ... }

Upvotes: 3

Rob
Rob

Reputation: 15168

You need a period before the class name in your CSS.

Upvotes: 1

Pencho Ilchev
Pencho Ilchev

Reputation: 3241

use .test. test is an element selector.

Upvotes: 8

tvanfosson
tvanfosson

Reputation: 532745

Because it should be .test, since it's a class, not just test.

Upvotes: 3

Related Questions