Dz.slick
Dz.slick

Reputation: 445

Best way to combine two CSS rules

I'm trying to combine the 2 blocks of codes shown below but it doesn't seem to be working. Any ideas on how best to do it?

Separate:

#rack #main #intro #nav-bar ul li:nth-of-type(8):hover {
    background-position: -290px -470px;
}
#rack #main #intro #nav-bar ul li.current-menu-item:nth-of-type(8) {
    background-position: -290px -470px;
}

Combined:

#rack #main #intro #nav-bar ul li:nth-of-type(8):hover,
#rack #main #intro #nav-bar ul li.current-menu-item:nth-of-type(8) {
    background-position: -290px -470px;
}

Upvotes: 1

Views: 134

Answers (2)

user2218109
user2218109

Reputation:

This should work but I didn't know why this is not working, I think li has a class so we have to define it first like this:

#rack #main #intro #nav-bar ul li.current-menu-item:nth-of-type(8),
#rack #main #intro #nav-bar ul li:nth-of-type(8):hover {
    background-position: -290px -470px;
}

Upvotes: 2

unclejam
unclejam

Reputation: 341

That is the correct way to combine 2 css styles, put a comma between them. If you can post your code I can take a look and see what might be causing the issue.

Upvotes: 0

Related Questions