Peter Elst

I hadn’t come across this problem before today but its interesting enough to do a little blog post about.

If you use an external CSS file in your HTML and both files have a different character set encoding (in my case an HTML page in Unicode and the CSS regular ASCII) the page will not render correctly. To resolve this you need to add the @charset directive at the very top of your external CSS file, in the example below using iso-8859-1 (Latin 1) as its value.

@charset "ISO-8859-1";

#header {
	color: #666666;
	font-weight: bold;
	font-size: 14px;
	text-align: center;
}

Another solution is of course to save the external CSS file as Unicode, nice bit of CSS trivia nonetheless ;)

This work, unless otherwise expressly stated, is licensed under a Creative Commons Attribution-Noncommercial-Share Alike 2.0 Belgium License.

No related posts.