I am optimizing the part of the web-based system that displays email content which, naturally, could vary and have any html structure. Currently it is displayed inside iframe, almost without additional css, so that the css from the main window does not affect it and the users see their mail almost "as is" (according to the browser settings). I'd like to get rid of iframe because of number of reasons which I don't want to cite here.
But the problem is that I don't know how to deal with all the css we use in the main window (not being a css-man, I still realize that the usage of general styling for body, div, p etc. is not a very smart approach, but unfortunately I can't change this). If I replace an iframe with a div, the users will see their emails in different styling and start to complain.
Is there a more or less simple solution to this problem?
Note: I found a couple of related questions here, but it seems they are somewhat different. The point is I don't want to cancel browser defaults. In the new window (iframe) the starting point is "no css + browser defaults". In the container, with the help of initial/unset, we got just "no css" situation. Or, at least, so I understand. In the all new web-app the difference is not very critical, but in the old app I am trying to improve it is. What users see is definitely wrong (because the look depends on the browser), but they are used to this "wrong", so if I do this right it will be very difficult to persuade them it is really right.
