How to change panel background color using css?

[mprreddy51]

Hi,

I have 5 panels in a row as shown in screen shot with yellow color heading.

I am trying to change the background color of each panel like red background, pink, blue...etc. I used this CSS file to get heading yellow, but I am not getting background color of each panel. Any ideas/suggestions?

CSS:

#panel2 h2.panel-title{
background-color: #FFD501;
}
#panel3 h2.panel-title{
background-color: #FFD501;
}
#panel4 h2.panel-title{
background-color: #FFD501;
}
#panel5 h2.panel-title{
background-color: #FFD501;
}
#panel6 h2.panel-title{
background-color: #FFD501;
}

Thanks,
PR

[jkat54]

Are you looking at the "styles" details on the right? There you find the computed style... also maybe style on tag in the code itself that you'll have to override.

Here i've changed the answers.splunk.com boxes to red:

[jkat54]

right click and inspect element in Chrome. You'll see the computed CSS as well as which div is in use etc. Then override that div/class in your css.

[mprreddy51]

Is there no syntax for that?
like: #panel6 h2.panel-title{
background-color: #FFD501;
}

[jkat54]

... im telling you how to find the div/class via developer tools. Once you know the correct div id / class etc. you can write your css using whatever syntax is appropriate.

[mprreddy51]

Yup, I followed that procedure rightclick and inspect but not getting the panel class rest all i am able to change the colors like heading ,spacing...etc thanks for ur responce