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?
With HTML, you can easily add HTML tag inside a table. The tag should open and close inside the <td> tag. For example, adding a paragraph <p>…
HTML elements can be nested (this means that elements can contain other elements). All HTML documents consist of nested HTML elements.
When you insert (nest) one tag within another, pay attention to the order in which you open each tag, and then close the tags in the reverse order. If you open element A and then element B, you must first close B before closing A.
HTML elements can be nested, meaning that one element can be placed inside another element. Nesting allows you to apply multiple HTML tags to a single piece of content. For example, try pasting the following code snippet inside your index.html file: <strong>My bold text and <em>my bold and emphasized text</em></strong>
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();
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.
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