I have built a couple of sites for a client and it turns out we are having issues with it displaying properly in older versions of Internet Explorer.
Can anyone explain to me what I need to do to make certain thing like radius and shadows compatible with older versions of IE
Or point me to a good article which explains it.
the sites are http://www.epicwealth.co.uk/
Ali Hussain answers:
This is due to the browsers being old.
You have a few options
1) You will need to write a separate css for the ie browser fixing the issues
2) Use HTML5Shiv
3) For border-radius you will need to use PIE.htc
All css fixes
Andrew Wong answers:
Try to add these few lines on the header:
<meta http-equiv="X-UA-Compatible" content="IE=EDGE" />
<!--[if lt IE 7]><script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE7.js"></script><![endif]-->
<!--[if lt IE 8]><script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE8.js"></script><![endif]-->
<!--[if lt IE 9]><script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script><![endif]-->
That should help you go through some old IE.
Here's a few resources to get you started:
http://jjis.me/a/912 - A good method using SVG.
You could of course use <em>polyfills</em> along with Modernizr. Here's a good list of resources:
Also, as Daniel said before, don't forget to declare your IE coding is IE9.
In fact, all already stated solutions are also valid, especially CSS3 Pie: