CODEWITHSUNDEEP
css
user291701
user291701

Reputation: 39671

Override global label font-size with my own css class?

I'm trying to update a website. There's a label element I want to style. It looks like:

 #foo {
     font-size: 9px;
 }

 <label id="foo"></label>

but it looks like a css definition for the "label" element is overriding the more specific style I'm setting. I'm seeing this in firebug

label {
    font-size: 16px;
}
.foo {
    font-size: 9px; /* strikethrough on my font-size declaration here */
}

so is there a way to override the default label font-size setting without modifying it for everything? (I thought my more specific definition would do that by default)

Thanks

Upvotes: 0

Views: 3779

Answers (2)

cimmanon
cimmanon

Reputation: 68319

You've mixed up the syntax for id with the one for class:

#foo { /* # = id, . = class */
    font-size: 9px;
}

Keep in mind that ids are supposed to be unique for the entire document

or switch your label to using a class instead:

<label class="foo"></label>

Upvotes: 3

rdiazv
rdiazv

Reputation: 1153

You could always use the !important indicator to give precedence to the rule.

font-size: 9px !important;

Upvotes: 1

Related Questions