How to exclude Custom CSS from one page only

Question

I've read through some similar questions, but can't quite work it out ... I've got simple Custom CSS on my WordPress site to increase the space under lists:

ol, ul {
  margin-bottom: 20px;
}

How do I exclude page ID 10875 from having that Custom CSS applied?

Assuming your template puts the page ID into a class on the body element as usual, something like body:not(.page-id-10875) ol, body:not(.page-id-10875) ul should probably work. — C3roe
– C3roe, Commented May 25, 2021 at 7:54

Fabrizio Calderan · Accepted Answer · 2021-05-25 08:05:54Z

1

Starting from a body element in which the class is not .page-id-10875 you can specify any nested element with :is(<list of selectors>) or :where(<list of selectors>) pseudoclasses, e.g.

body:not(.page-id-10875) :where(ul, ol) {
   margin-bottom: 20px;
}

edited May 25, 2021 at 8:05

answered May 25, 2021 at 8:00

Fabrizio Calderan

124k26 gold badges171 silver badges183 bronze badges

Sign up to request clarification or add additional context in comments.

6 Comments

Banter Over a year ago

Thank you Fabrizio! Unfortunately that had no effect.

Fabrizio Calderan Over a year ago

Provide the actual code with the actual attribute on the body

Banter Over a year ago

Thank you Fabrizio. My page is here cell.bantergroup.com.au/sitemap

Fabrizio Calderan Over a year ago

it perfectly works, of course you need to remove your rule or it will be applied

raysefo Over a year ago

Is there a way to exclude a CSS file? @FabrizioCalderan

|

Sabih Ali · Accepted Answer · 2021-05-25 07:57:39Z

0

body:not(.exclude-page-id-class) ul,body:not(.exclude-page-id-class) ol {
 margin-bottom: 20px;
}

answered May 25, 2021 at 7:57

Sabih Ali

812 bronze badges

4 Comments

Banter Over a year ago

Thank you Sabih! Unfortunately that had no effect.

Sabih Ali Over a year ago

share demo example

Banter Over a year ago

Thank you Sabih. My page is here cell.bantergroup.com.au/sitemap

Sabih Ali Over a year ago

comment this ol, ul { margin-bottom: 20px; } and add body:not(.page-id-10875) :where(ul, ol) { margin-bottom: 20px; }

Collectives™ on Stack Overflow

How to exclude Custom CSS from one page only

2 Answers 2

6 Comments

4 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

6 Comments

4 Comments

Your Answer

Sign up or log in

Post as a guest

Related