{"id":647,"date":"2013-05-26T08:31:15","date_gmt":"2013-05-26T08:31:15","guid":{"rendered":"http:\/\/scunster.co.uk\/?p=647"},"modified":"2013-11-20T12:04:49","modified_gmt":"2013-11-20T12:04:49","slug":"new-css-ie6-ie7-ie8-browser-compatability-fixes","status":"publish","type":"post","link":"https:\/\/scunster.co.uk\/?p=647","title":{"rendered":"New CSS &#038; IE6. IE7 &#038; IE8 browser compatability fixes"},"content":{"rendered":"<p>Most browsers such as Firefox, Chrome and Internet Explorer 9+ support and render most css in a very similar way.<\/p>\n<p>Depending on which statistics you view IE8 &amp; IE7 still account for as much as 20% of internet users so if you ignore them your site could be displayed incorrectly for up to as many as 1 in 5 users. originally posted in 2013, as time goes by this number will go down.<\/p>\n<p>Whilst the majority of users will be able to see modern CSS features such as opacity \/ transparent backgrounds, menus etc and other aesthetic affects like rounded corners and box\u00a0 \/ text shadows these older browsers will not.<\/p>\n<p>The easiest way to target these older browsers is as follows:<\/p>\n<p>In your main websites index.html or index.php add the following lines:<\/p>\n<p><code>&lt;!--[if IE 6]&gt;<br \/>\n&lt;link rel=\"stylesheet\" type=\"text\/css\" href=\"ie6.css\"&gt;<br \/>\n&lt;![endif]--&gt;<\/code><\/p>\n<p><code>&lt;!--[if IE 7]&gt;<br \/>\n&lt;link rel=\"stylesheet\" type=\"text\/css\" href=\"ie7.css\"&gt;<br \/>\n&lt;![endif]--&gt;<\/code><\/p>\n<p><code>&lt;!--[if IE 8]&gt;<br \/>\n&lt;link rel=\"stylesheet\" type=\"text\/css\" href=\"ie8.css\"&gt;<br \/>\n&lt;![endif]--&gt;<\/code><\/p>\n<p>Simply make sure that the path to ie6\/7\/8.css is correct and you can override your sites default css for just users of these older browsers.<\/p>\n<p>Target via CSS Hack (The ugly way)<br \/>\nIf it is just the odd piece of code you need to change you can target them directly in your CSS with the following code eg.<br \/>\nThis is called the ugly way \/ hack as it is unknown what effect these lines will have when read by newer browsers in the future.<\/p>\n<p><code>background: url(..\/images\/picture.png); \/\/ All other browsers will use this line<br \/>\nbackground: none\/9; \/\/Hack for ie6,7 &amp; 8<\/code><\/p>\n<p>The \/9 would tell browsers older than IE9 to render no background but all other browsers would display the background as an image.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Most browsers such as Firefox, Chrome and Internet Explorer 9+ support and render most css in a very similar way. Depending on which statistics you view IE8 &amp; IE7 still account for as much as 20% of internet users so if you ignore them your site could be displayed incorrectly for up to as many [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[162,165],"tags":[],"class_list":["post-647","post","type-post","status-publish","format-standard","hentry","category-css","category-websdesign"],"_links":{"self":[{"href":"https:\/\/scunster.co.uk\/index.php?rest_route=\/wp\/v2\/posts\/647","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/scunster.co.uk\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/scunster.co.uk\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/scunster.co.uk\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/scunster.co.uk\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=647"}],"version-history":[{"count":3,"href":"https:\/\/scunster.co.uk\/index.php?rest_route=\/wp\/v2\/posts\/647\/revisions"}],"predecessor-version":[{"id":890,"href":"https:\/\/scunster.co.uk\/index.php?rest_route=\/wp\/v2\/posts\/647\/revisions\/890"}],"wp:attachment":[{"href":"https:\/\/scunster.co.uk\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=647"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/scunster.co.uk\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=647"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/scunster.co.uk\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=647"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}