Scott Andrews wrote:
>We have a site that embeds an HTML email message inside a page that uses
>CSS for layout. Currently, the styles from the containing site are
>affecting the display of the embedded message. Is there a way to turn
>off CSS and the cascade for content inside a block level element?
>
>The only thing I can think of is to create a rule that overrides every
>single CSS property with a default value. Like this:
>
>#turnOffCss * {
> border-width: 0 !important;
> border-color: #000 !important;
> border-style: solid !important;
> ...
>}
>
>Clearly this is poor hack and will not scale well into the future. Any
>other ideas would be most appreciated.
>
>Sincerely,
>Scott Andrews
>
Hi Scott,
As said before, I think an Iframe can be a good solution.
Probably another solution could be almost the same as your description;
but only the opposite way of thinking. :-)
What I mean is this.
What you have now will be some kind of:
p, h1, h2 {margin:0; padding: 0;}
#menu { ...position, colors, borders, backgrounds...}
#menu li { ...position, colors, borders, backgrounds...}
#content { ...styles...}
and so on.
The new model can be:
<body>
<div id="wrapper1">
... al the containing site stuff before
the embedded message has to be displayed ...
</div>
<div id="messagecontainer">
... the embedded message ...
</div>
<div id="wrapper2">
... al the containing site stuff after
the embedded message has to be displayed ...
</div>
</body>
Then in the css you can place the wrapper-selector before all existing
styles for the containing site stuff, like:
#wrapper1 p, #wrapper1 h1, #wrapper1 h2 {margin:0; padding: 0;}
#wrapper1 #menu { ...position, colors, borders, backgrounds...}
#wrapper1 #menu li { ...position, colors, borders, backgrounds...}
#wrapper1 #content { ...styles...}
and the same for #wrapper2
In your model the surrounding styles are the "normal styles", and the
messages are the exceptions, to make a solution for. - Now this is
mirrorred: the messages have the default styles (or can have particular
message styles), and the wrappers for the main page are the "exceptions"
with an own style apart from the message styles. I guess it will work as
long as there are no overlapping class names or ID names in both. To
avoid this, you can give your 2 wrappers a "password" like
id="wrapper1abracadabra1563" or id="wrapper2butnot4u". Should be quite a
coincidence if somebody is using exactly the same ID's in his message
[1]. Then even a simple <b>...</b> can have a different meaning inside
or outside the message. :-)
Succes and greetings,
francky
[1]
Or deliberately by studying your source code and copying the passwords
into the message styles. - But then he/she shouldn't be wondering why
his/her message has a strange layout! ;-)
______________________________________________________________________
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
