Stylesheet taken-over/replaced by Chinese characters

So I think I figured it out. This is weird. But anyway.

I copied and pasted your HTML to a local file to experiment with. And it loaded just fine. It was saved as UTF-8. Then I changed it to UTF-16, and I got exactly what you're seeing! As far as can tell, the browser (Firefox for Linux for me) is assuming the linked files are all in the same encoding as the HTML...

So - I assume the file on the server is in UTF-16, and if you change it to UTF-8 you should be good. Hope that fixes it!

PS: According to Firebug, your HTML is compressed by your server, even if you never explicitly told it to. But that doesn't seem to be causing any problems, thankfully.

I encountered this same problem with XML files exported from PowerShell that were embedded in iFrames.

There was no issue in IE10/11 or Edge, but Firefox and Chrome wouldn't load the stylesheet.

The original page loading the iFrames was UTF8 encoded, same with the stylesheet. However, the XML file was exported to UTF16LE ("Unicode" in PowerShell). When the XML file was loaded from the iFrame, it loaded the stylesheet as Chinese characters.

I converted the encoding in PowerShell...

Get-Content C:\foldername\file.html -Encoding Unicode | Set-Content -Encoding UTF8 C:\foldername\file.html

...and it worked! My guess is that IE must treat the encoding of all files the same as the parent, which meant that the UTF16LE encoded file was rendered as UTF8. Chrome and Firefox apparently don't do that.

Thanks Xavier Holt for setting me on the right path!