Selective "Clean Slate"

[patenaudemat]

Hey there,

I'm creating a little app that grabs pieces of content from remote locations (via JavaScript/Ajax), and creates elements dynamically on a web page to display them. These elements have their own style information, which I assign inline. This seems to work very well, except for one issue: some of the style information from the main page bleeds over.

Let me tell you what I mean. For example, my page has a CSS rule that adds a bottom border to all images. I don't want that to apply to my new content, but I a) don't want to modify my page's stylesheet (I can add style elements dynamically, which is the preferred method), and b) can't really take into account all of the different things I can reset to their default, since this script could be used on any site.

Basically what I'm looking for is a way to give a group of elements a clean slate; that is, for example, to be able to take one class, and tell that class not to inherit any CSS properties, and only use the ones defined specifically for it (be it inline, or in a style section pertaining only to that element). Is there any way to accomplish this?

Thanks in advance!

-Matt

[KDLA]

Why don't you add a div before your content with an id called clean slate, which you could specify the changes to that section's content? With the div association, that will not change your previous css styling.

[patenaudemat]

Not a bad concept, but the idea is that this is being designed for use on other websites. I won't have any clue what CSS properties I'll need to reset, unless I should just go through the standard and reset all of them to what the defaults should be.

-Matt