CODEWITHSUNDEEP
html
Dennis Hackethal
Dennis Hackethal

Reputation: 14275

Nest html tags inside html

I am building a platform where people can send emails - to display a preview of the emails, I use a div below the form where they can type the message.

So the general structure looks like this:

<html>
    <body>
         <form>
              <!-- Form to enter email here -->
         </form>
         <div>
              <!-- Email preview here -->
              <html>
                   <!-- Email content, updated everytime user types something --->
              </html>
         </div>
    </bod>
</html>

However, simply using the html tags inside the html document itself seems to confuse every browser - also, it doesn't seem very clean.

Since the email that is sent will be a whole html document of its own, it would be the easiest to just put all that inside the div.

How can I do that in a valid, clean way?

Upvotes: 7

Views: 12138

Answers (2)

Mitya
Mitya

Reputation: 34556

Use an iframe. You can write dynamic content to them - you don't always have to load physical pages into them with an src attribute.

HTML:

<iframe name='preview'></iframe>

JS (inside DOM-ready callback)

var doc = document.preview.open("text/html","replace");
doc.write('<html><body><p>this is some content</p></body></html>');
doc.close();

Upvotes: 6

defau1t
defau1t

Reputation: 10619

You can't get this around using the approach you have used. Getting emails rendered in mail clients is a chalenge, You may want to use an iframe instead. However you have to make sure that the contents of an email copy have to be fully in a table layout format.

Upvotes: 1

Related Questions