问题
I am generating iframe using javascript with dynamic html. My dynamic html looks like-
<head>
<style>
...
.bar {background-color: #EB593C;}
...
</style>
</head>
Then iframe contents all code till .bar {background-color: after color code html/css is not included in iframes contents.
If I replace hex color code with rgb or text color name then that is working fine.
But as I said html is dynamic so I cant replace all the hex color codes to to rgb or text.
var iframe = document.createElement('iframe');
//var html = '<style>body {background-color: #EB593C;}</style><body>Foo</body>'; // not working
var html = '<style>body {background-color: red;}</style><body>Foo</body>'; // working
iframe.src = 'data:text/html;charset=utf-8,' + encodeURI(html);
document.body.appendChild(iframe);
Please check jsfiddle