IE8 issues


I have a wordpress website which is facing compatibility issues in Internet Explorer 8.

The navigation menu is not loading properly in IE8 & IE7.

Bad Nav in IE8

Also, the content boxes in my site are not transparent in IE8. I understand that is because I’m using RGBA and I need to know how to fix it.

Please tell me how can I fix the navigation menu in IE8 & IE7 and the rgba transparent box.


IE8 and under don’t understand media queries so the navigation doesn’t change at smaller widths. There is a JS polyfill you can use and it will add support for media queries:

IE8 and under don’t understand rgba so you either use a solid background as a default (just put ‘background:blue’ (or whatever colour you want) before the rgba rule). Or alternatively use a transparent png for all browsers instead of rgba.

Or you can use the alpha filter for IE8 and under but it does often cause more problems than it solves. You can read up on all the techniques here.