• I'm sure you won't but don't leave those anonymous "hello world" text bits there :-)

    I didn't actually test on anything but Firefox - the perils of doing stuff when you're meant to be working :-). I imagine it wouldn't take much to have it work in all browsers. If I was in control of the HTML output I would dispense with the floats and replace them with inline blocks. But you need to eliminate white-space between tags to make it fit, as white space in inline and inline block elements is rendered, which can cock up the layout.

    Whilst I would dearly love both browsers to die, (and MS to dump their codebase and make IE10 with webkit) if it doesn't take too much effort to support IE7 (and it shouldn't) and IE6 (which will be more of a PITA) then you have nothing to lose by supporting it. All those > descendent selectors in your CSS won't work in IE6, and I can't recall but maybe not IE7 either. Replace them with simple child selectors (i.e. spaces) and you might find your CSS works just as well, but now also works in IE6. IE also has buggy handling of multiple class selectors, such as .threadbit.dark, which you might be able to avoid by choosing another rule to select it with. Also // is not a CSS comment - use /* comment */ Finally, IE9 is supposed to support HTML5 so you need to make the conditional comment that loads the html5shim only trigger for IE8 and below.

    Once the work is done you could save yourself a final few HTML bytes by removing the clearfix class from the HTML and add matches to catch whatever (e.g. .threadbit) you need to clear floats. Best done at the end, with a find-replace, as you're going to need it in a few places probably and it's useful while developing to have it as a separate class.

About

Avatar for bq @bq started