How to hit the #site-description

gregsoulsby · Member · Mar 7, 2012 at 2:28 pm
Copy link

Add topic to favorites
I have set the h1, h2, h3 on my wp site to a dark color.

In my template the #site-description at the top of the page is against a h2

<h2 id=”site-description”>Generating error free business systems</h2>

the #site-description is coming out dark, but it needs to be white.

How in CSS do you overwrite the h2 color with a specific color for h2 #site-description?

Nothing I tried worked.

The blog I need help with is: (visible only to logged in users)
designsimply · Member · Mar 8, 2012 at 12:20 pm
Copy link
You should be able to use the ID itself to set the color to white like this:
```
#site-description {
color: white;
}
```
If that doesn’t work for you, please provide a link to your blog so we can take a look directly at the site you’re working on.
gregsoulsby · Member · Mar 8, 2012 at 12:27 pm
Copy link
Thanks for the reply. I have this:

#site-description {
color:white;
font-size:14px;
margin:0 270px 3.65625em 0;
}

but when I look using Google developer tool the color is being overwritten and I dont know why – maybe the h2 color is taking presidency?

The site is http://modeldrivers.wordpress.com/

Many thanks.
designsimply · Member · Mar 8, 2012 at 12:59 pm
Copy link
In your Appearance → Custom Design → CSS page, you have this:
```
margin-bottom:4px;
font-size:20px;
font-style:normal;
font-weight:normal;
font-variant:normal;
font-family:"Cooper Black", Times, serif;
color:#444444!important;
}
```
The “!important” listed for the h2 font color is overriding the #site-description color. Remove “!important” from that block and your site description color will start working.

As a general rule, you should avoid using “!important” unless it’s absolutely necessary—sometimes it is, but most times you don’t need it.
gregsoulsby · Member · Mar 8, 2012 at 1:03 pm
Copy link
Cool – many thanks
designsimply · Member · Mar 8, 2012 at 1:04 pm
Copy link
Cheers :)

No items found.