Содержимое iframe со стилем в голове и шестнадцатеричным цветовым кодом не работает ⇐ CSS

[Anonymous]

Я создаю iframe, используя JavaScript с динамическим HTML.
Мой динамический HTML выглядит так:

Код: Выделить всё

...
.bar {background-color: #EB593C;}
...

Тогда iframe будет содержать весь код до .bar {background-color:
после того, как цветовой код html/css не будет включен в содержимое iframe.
Если я заменяю шестнадцатеричный код цвета на RGB или имя цвета текста, то все работает нормально.

Но, как я уже сказал, HTML является динамическим поэтому я не могу заменить все шестнадцатеричные коды цветов на RGB или текстовое сообщение.

Код: Выделить всё

var iframe = document.createElement('iframe');
//var html = 'body {background-color: #EB593C;}Foo'; // not working
var html = 'body {background-color: red;}Foo'; // working
iframe.src = 'data:text/html;charset=utf-8,' + encodeURI(html);
document.body.appendChild(iframe);

Пожалуйста, проверьте jsfiddle

Подробнее здесь: https://stackoverflow.com/questions/374 ... ot-working