IE<9 does not understand data: URIs, so I'm outputting two different stylesheets: one with normal links to images for IE 8 and below, and one with base64-encoded inline images, for other browsers.
<!--[if lte IE 8]>
<link rel="stylesheet" type="text/css" href="/public/themes/url.style.css">
<![endif]-->
<!--[if gt IE 8]>-->
<link rel="stylesheet" type="text/css" href="/public/themes/b64.style.css">
<!--<![endif]-->
Problem: In IE9, I'm seeing a stray --> output on the page. Because it's inside the <head> it appears at the very top of the page. How should I get rid of it?
And I've got it. I did search for valid conditional comments, and found an article telling me to do what I was already doing, but then by chance I came across a by-the-way remark in another answer here which showed me the correct way to do it:
<!--[if lte IE 8]>
<span>This is for IE 7 and below.</span>
<![endif]-->
<!--[if gt IE 8]><!-->
<span>This is for all other browsers (IE 8, and browsers which don't do conditional comments).</span>
<!--<![endif]-->
See the difference: <!--[if gt IE 8]><!--> instead of <!--[if gt IE 8]>-->.