Iframe content styled in head with hex color code not working
I am generating an iframe using javascript with dynamic html. My dynamic html looks like
<head>
<style>
...
.bar {background-color: #EB593C;}
...
</style>
</head>
Then the iframe contains all the code up to .bar {background-color: after the color code, the html / css is not included in the iframes content.
If I replace the hexadecimal color code with the rgb name or text color name then it works fine.
But since I said html is dynamic so I cannot replace all hex color codes with 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 the jsfiddle
+2
mahesh kajale
source
to share
No one has answered this question yet
See similar questions:
3
or similar:
763
591
486
465
nine
1
0
0
0