user11566218
user11566218

Reputation:

Excluding several pages from styling by CSS

I have some style that is supposed to be applied on all pages except three of them. It work fine for one page when I use

body:not(.home) #menu-footer{
    color:green;
}

but how does it work for my other two pages (page-id-6 and page-id-7)? I tried this

body:not(.home) #menu-footer, body:not(.page-id-6) #menu-footer, body:not(.page-id-7) #menu-footer{
    color:green;
}

but its not working.

Upvotes: 0

Views: 380

Answers (2)

banky
banky

Reputation: 848

Why not use a class for those pages you want to apply same styling to, in this case page ids 6 & 7, then apply a style. Here I'm using common_pages;

common_pages{
   Color: green;
}

Upvotes: 1

misorude
misorude

Reputation: 3431

body:not(.home) #menu-footer,
body:not(.page-id-6) #menu-footer,
body:not(.page-id-7) #menu-footer { … }

This doesn’t work, because when the body does have the class page-id-6, the other parts become true - you have a body that matches body:not(.home) now*, so the first part of this selector applies.

Apply all your “nots” at the same time instead:

body:not(.home):not(.page-id-6):not(.page-id-7) #menu-footer

This only applies when the body has neither of those three classes.


* Assuming of course, that only one of those classes is ever going to be set, but I guess that can be implied from the context of your question here.

Upvotes: 1

Related Questions