Customize active item of CMenu with CSS

Yii 1.1 General Discussion
1

Hi, what should I do to customize the look of the "active item" in a CMenu with CSS?

I’d like something simple, like changing the color of the text, bold, and a different background color.

I tried adding the following in the file /css/main.css




.active

{

    color: #FF0000;

    background: #B7D6E7;

    font-weight: bold;

}

But only the background color is changed. The other CSS attributes seems to be ignored (or maybe overriden?).

I also tried the following, as I saw another post:




.active ul li

{

    color: #FF0000;

    background: #B7D6E7;

    font-weight: bold;

}

but in this case, none of the attributes seems to work.

I don’t have much experience with CSS and the official documentation doesn’t help at all.

I’m working on a generated yii application and I’m guessing that “active” style is already in effect somewhere else (for the main horizontal CMenu of the application, where the links of “contact”, “about”… are) but I’m afraid I don’t know where and I don’t know how to override/customize it for my custom CMenu.

I will appreciate any directions regarding this problem. Thank you.

2

For those interested, my solution was to use in /css/main.css:




li.active a

{

    color: #FF0000 ! important;

    background-color: #B7D6E7;

    font-weight: bold;

}

In my case, the "! important" was necessary because the font color was already being set in the following styles, also in /css/main.css:


.operations li a

.operations li a:visited

.operations li a:hover

Just to clarify, these styles are those that comes with the default yii application.

Hope this helps.