Can I Display An Inner Div With An Independent Stylesheet?

My application lets users edit documents. The editor widget, unsurprisingly, represents user documents as HTML. I need to redisplay the documents outside the editor, but inside my

Solution 1:

You have two options:

1.) Reset all styles on the div containing your document, and make sure your document's styles are prioritized over the reset. This could get messy.

2.) Use an iframe and load the document and styles inside the iframe.

<iframesrc=".../documents/myDocument.html"></iframe>

Where "myDocument.html" is an html document containing the document and styles (treat the document html page as any other html page, and make sure it has proper head and body tags, etc.

Other options:

1.) Open the document html page inside another window.

<ahref=".../document/myDocument.html"target="_blank" >Open Document</a>

2.) Render the document as a pdf, and load it into the page using a pdf viewer. (you would want to keep a backup of the original document, as the conversion back would be terrible, I presume).

Solution 2:

Yes and no. If you want to use a div, you will want to use a stylesheet with styles defined to "reset" the css for that div. That would basically undo your site's styles, and then any new style selectors should be limited to within that div itself.

Otherwise, I would suggest using something like an iframe where you can render a truly independent document.