Is it possible to cancel a CSS Declaration?

It seemed a good idea at the time to define a width for the <p> element:

Content p { width: 450px; }

But now after building 80 pages into my CMS, I need <p> to act like normal with no width on certain pages.

Content .myclass p { width: “not-set”; }

auto doesn’t work, 100% doesn’t work. I’ve considered a javascript solution that messes with class names, but would prefer a css rescue of seven or eight characters!


If you have the class on the p then it should look like Content p.myclass {}

Switch them. Sort of.

Content .specialPageThatNeedsWidthOnParagraphs p { width: 450px; }

Content p { /width: “not-set”;/ }

Yes, that would work, but, I have 25 pages of little used old newsletters that require p to be normal and 80 pages of much used info that use the width. I am building this into a CMS that I want non coders to be able to enter content into. I am afraid adding a div to the page would blow their minds.

The 25 pages are old code that employ inline style declarations in tables.

I guess you can’t cancel, only replace, so I am going to use php to make it happen. Something like putting in the body tag:

$class ="article alias from db";
if ($class != "myclass"){
 class ="regularcontent";
echo "class=\\"".$class."\\"";

Hopefully that will do it. Thank you everyone for your help!

Not 100% if that will work. Is everything in the same directory?

No, but “everything” is in a db.

Can you distinguish between the pages (a class or id on the body tag or similar)? If so then you could set up the fixed width to only apply for the class or id used by the new pages.


There is no CSS reason for that not to work (if no other related declarations):

#content p { width: 450px; }
#content .myclass p { width:auto; }
  • The second selector set back the default value auto
  • The second selector is more specific then the first one

Have you check the first assumption that you may not target the right element with your second selector ?

Could we have a look to the HTML code ?