0

I want to display mail messages in a web page. These mail message are comming from an exchange server and contain a bunch of style elements.

When i load these mail in a div, those style elements break my own page style by overriding some of them.

Is there a way to load an html mail body in isolation from the page in which it'll be loaded? (and without Iframes of course).

Thx

Lucas.de
  • 555
  • 8
  • 17

2 Answers2

0

You could reset the style for this div only so it wont break your own CSS.

You should look at this post :

Reset/remove CSS styles for element only

Community
  • 1
  • 1
Nirnae
  • 1,315
  • 11
  • 23
  • It solve only half of my problem... I also need to display the mail with it's own css so if remove the css, the mail will look flat (or even will be altered by my own CSS). – Lucas.de Oct 28 '15 at 13:54
  • Can we have the part of your code where you include this mail ? – Nirnae Oct 28 '15 at 13:56
0

I think one solution would be to insert mail's html content within a div having a specific id (ie id="foo") and then, process the style of the mail content to add that id before each class declaration in the mail.

All classes declared within the mail will look like this:

#foo H1{
...
}

#foo body{
...
}

Then, the scope of this classses will only be the id in which the mail body was injected.

I'm still looking for the cleanest way to do this (Jquery, Rivets, etc.)...

Lucas.de
  • 555
  • 8
  • 17