ansaurus

Question

Can I remove an already rendered CSS attribute or declaration?

Answer 1

+2 A:

You can set the CSS attribute back to auto lower down in the CSS rules:

#element {
    margin: 0;
}

#element {
    margin: auto;
}

Pat 2010-08-05 14:33:39

The 'what' is simple, the 'how' is not recommended for trying.

digitalFresh 2010-08-05 14:37:01

I'm slightly confused by the use of #element in both cases. Doesn't it make the first declaration useless? Also, I don't believe using auto for an attribute like color is valid. For great examples, try setting hspace on the avatar images on this site without removing the reset CSS.

Bryan 2010-08-05 14:47:17

My double `#element` example was just to show how the lowest CSS rule would take precedence. So in your case, if you've got `margin: 0` in a reset stylesheet, you just have to make sure that lower in that stylesheet (or another stylesheet further down your markup) you set `margin: auto` on the element you want to undo the zero setting on. As for color, you are correct - there's no `auto` or `default` value.

Pat 2010-08-05 15:08:39

Ah, I understand now, thanks for clearing that up. Unfortunately setting it to "auto" still does not work since it then sets it to the user-agent stylesheet declaration rather than removing any declaration entirely.

Bryan 2010-08-05 15:12:11

Answer 2

A:

I think you would have to set them back to their default values, as set by the specification: http://www.w3.org/TR/CSS2/

For color, I don't believe there is a default value set; it looks to the user agent (browser) to define that. So, once a color is set in CSS, I don't believe it can be "unset" later - you would have to manually remove that style from your reset.

RussellUresti 2010-08-05 14:45:09

Unfortunately this doesn't have the desired outcome. The "default value" will still override hspace/vspace attributes. I need "no value" to be set, as if CSS didn't exist on the page.

Bryan 2010-08-05 14:49:13

All elements have styles applied to them by default, they're either browser specific or following the CSS specification - that's why, even if you don't use any CSS at all, the h1 tag looks different than the h2 tag; the browser is applying CSS specification styles. Perhaps the issue with hspace and vspace not working is unrelated to the CSS reset; have you tried removing the reset to see if those attributes have any effect when the reset is gone?

RussellUresti 2010-08-05 19:01:46

Yes, I have removed the CSS entirely and it works as expected. If you're using Firefox with Firebug, you can inspect avatar images right here on this page. Remove margins from the img in the CSS and then edit the html to contain hspace or vspace attributes. You will see the expected behaviour. If no margin declaration is ever made on the img, the hspace works correctly.

Bryan 2010-08-05 19:16:56

Very odd. My suggestion is that if you can physically edit the hspace and vspace attributes, just use inline styles instead. So <img hspcace="150" /> goes to <img style="margin: 0px 150px" />

RussellUresti 2010-08-09 21:38:07

ansaurus

tags:

views:

answers:

Can I remove an already rendered CSS attribute or declaration?

related questions