[thelist] (Avoiding) CSS precedence

Eike Pierstorff eikepierstorff at googlemail.com
Tue May 11 05:42:26 CDT 2010

Dear all,

I have some HTML Code that will be dumped into arbitrary pages, that
is, the HTML and some javascript and the CSS file are loaded into a
page via a javascript call for a "widget type" application (see here
how that looks like: http://tinyurl.com/3al8e2m )

The problem is of course that my HTML inherits CSS styles from the
host page, which breaks the layout of the widget, and I had somehow
underestimated how much trouble that would cause. It seems that I have
to reset every possible CSS property for every HTML element I use and
even so it might happen that some rule from the host site takes
precedence and breaks my code.

Currently I'm using a lot of !important statements which make for a
terribly bloated style sheet and is by no means failsafe. Other
options I have considered so far

- using iframes - the client specifically does not want this
- using inline styles - makes for even more bloated code
- ?....

Is there any way to insert HTML markup into an arbitrary page and yet
avoid inheritance/precedence of the CSS of the host page (or another
way to solve the problem) ?

Thank your for your time,


More information about the thelist mailing list