ieQsan
ieQsan

Reputation: 133

Bootstrap Menu bar hover color remain in parent element

I overwrite the css for Bootstrap Menu bar for mouseover in parent element. Only background color change not change in text color.

enter image description here

Here is my css

ul.nav > li:hover {
    color: #FFFFFF !important;
    background-color: #337AB7 !important;               
}

ul.nav li li:hover {
        text-color: white !important;
        background-color: #337AB7 !important;               
}

Thanks in advance.

Upvotes: 1

Views: 88

Answers (3)

ieQsan
ieQsan

Reputation: 133

I found the solution.

ul.nav li:hover > a {
                color: #ffffff !important;
                background-color: #337AB7 !important;               
            }

Thanks

Upvotes: 1

Maniarasu V
Maniarasu V

Reputation: 209

Try to change the "color" of <a> tag inside <li> Like this,

ul.nav > li > a:hover{
    color : red;
}

Upvotes: 1

z0mBi3
z0mBi3

Reputation: 1544

The property to change the text color is color and not text-color

ul.nav > li:hover {
    color: #FFFFFF !important;
    background-color: #337AB7 !important;               
}

ul.nav li li:hover {
        color: white !important;
        background-color: #337AB7 !important;               
}

Upvotes: 1

Related Questions