I have a div LivePreview that previews the text entered into a textarea as HTML using jQuery. The problem is, it inherits all the other styles on the page, as it should...
Is there a way to clear all styles for just the LivePreview (table, p, etc...) or will I have to reset each of the LivePreview children manually?
The way to do it is as done in jsfiddle itself which does a similar thing to what you want. The way they seem to have doe it is put that box within an iframe.
Anything nested within the iframe loses any CSS that has been called out of it unless the CSS file is explicitly linked to from within the `iframe. So your code should be:
<div class="LivePreview">
<iframe>
<head></head>
<body>
/* Any HTML you want and will have the default CSS*/
</body>
</iframe>
</div>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With