CSS Ie8 Can't Style a List Element

IE8 display inline-block not working

I'm guessing you haven't declared a doctype. Try placing this on the first line, before the html tag:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

The code you pasted works in IE8 with that doctype.

CSS styles not being loaded in IE8

@Guffa put me onto the right track with this: the problem is that the HTML5 elements aren't working in Internet Explorer 8 and lower.

Modernizr would fix this, but: http://www.modernizr.com/docs/#installing

Drop the script tags in the <head> of
your HTML. For best performance, you
should have them follow after your
stylesheet references. The reason we
recommend placing Modernizr in the
head is two-fold: the HTML5 Shiv (that
enables HTML5 elements in IE) must
execute before the <body>, and if
you’re using any of the CSS classes
that Modernizr adds, you’ll want to
prevent a FOUC.

So, you simply need to move Modernizr from just before </body> to inside the <head> element.

Why can't I style the html element using attribute or class selectors in IE8?

Ok, so I am a fool, but for anyone else who stumbles across this (as it is super mysterious until you realize it), I had forgot that I was using HTML5 Boilerplate-style conditional comments on the html element, so that the template variables were only being attached to the html element in non-IE browsers.

Internet Explorer 8 problems with CSS

There are no such headings as h7 and h8. Only h1-h6. IE8 and IE7 don't understand unknown elements and do not style them.

Internet Explorer 11 ignores list-style:none on the first load

Reply to Peter:

No idea if this would be better. Copied from the jquery git

list-style-image: url(data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7);

IE8 Developer Tools - add CSS style

You can:

add a style attribute (right click the html tag and click add attribute (with the name style, and then edit the style attribute once its added)
Click the CSS tab, right click the empty space, and add a rule (this is like adding a line to your css file)

How do I inject styles into IE8?

In MSIE set the cssText-property of the styleSheet-object related to the <style/>-element:

   $('<style id="custom_persona_css"></style>').appendTo('head'); 

   if($.browser.msie)
   {
    $("#custom_persona_css").prop('styleSheet').cssText='#abc{ color:#000000; }';
   }
   else
   {
    $("#custom_persona_css").append('#abc{ color:#000000; }');
   }

http://jsfiddle.net/doktormolle/BLJUv/

More Info: http://msdn.microsoft.com/en-us/library/ie/ms533698%28v=vs.85%29.aspx

How can I get IE8 to accept a CSS :before tag?

Update: I misread the page! IE 8 does support :before with images, it just doesn't when it is in IE7 compatibility mode.

IE8 supports :before, ~~but not~~ and also images as content when not in compatibility mode. Kudos to @toscho for testing!

Source
Detailed comparison of which browsers can deal with what sort of content

How I love quirksmode.org, which makes dealing with this stuff at least half-way bearable. The guy deserves a medal!