More on tick marks in HTML

My original post about displaying a tick mark in HTML is one of the more popular hits on this site. This fact and the increasing usage of IE7 and FireFox drove me to come up with a nicer solution than the one proposed there (using the lowest common denominator checkbox input field).

Internet Explorer supports something called conditional comments. Using these you can serve up different content to different browsers directly in your HTML, rather than doing funky server-side things. I have to use this approach since I'm generating a static HTML file. So here is the markup -

<!--[if IE 7]><!--> 
&#10003; 
<!--<![endif]-->
<!--[if lt IE 7]>
<input type="checkbox" disabled checked>
<!--<![endif]-->

The if IE 7 comment will be rendered by IE7 and any other browser. The if lt IE 7 comment should only be rendered by IE6 and below. I've tested it in IE6, IE7 and FireFox 2, which covers enough bases for my needs. And here is the output, which hopefully should show some kind of tick mark.

✓

Update - there's a more up to date and correct version of this available here