February 26, 201511 yr My IE7 style sheet is in a condition. There is a style for a selector which I must edit, but the selector style is not being read within the IE7 conditional statement, which doesn't make sense especially if the style for the selector is being read outside of the conditional style sheet ? I'm just wondering if anyone has any suggestions as to a solution ? It's too bad that unlike the developer tools in IE8, the developer tools in IE8 don't work similar.
February 27, 201511 yr Check the order of your stylesheets in the html file. The stylesheet link or styles for all browsers should be first and the stylesheet link or styles for IE7 should follow so that the IE7 styles overwrite the general styles. Note that inline styles in the body code will overwrite all stylesheet codes. Without seeing your code I can't be sure if this answer helps. If you give your code you usually get a quicker answer.
February 27, 201511 yr Is there are reason you are developing with support for IE7? I know some places still have to support because it's a government site or something, but outside of that IE7 support is very rare now, most new builds rarely support IE8 now either. I just pose the question in case you assumed we were all still supporting this rather ancient browser. If you have a genuine reason then this site may help you target the browser http://browserhacks.com/ Edited February 27, 201511 yr by rbrtsmith
February 27, 201511 yr Author Go to this page, and I'm experiencing whereas p.imgbox are all floating to the left in IE7, I want it to alternate as is in newer versions of IE ? I know IE7 is phasing out, especially when Spartan gets released by Microsoft, for now I'll support IE7 at the very minimum.
February 27, 201511 yr I agree with @@rbrtsmith, IE7 has been very dead for some time. Check something like http://gs.statcounter.com and you'll see it hardly appears on the radar at all, globally or UK. Even IE8 is fading fast with sub 2% usage in the UK.
February 27, 201511 yr Author I figure I will continue to support for now, besides it shouldn't be too much of a hassle to get things to work in IE7 !
February 28, 201511 yr There's loads of things you cannot do in your design because of IE7, The biggest one is changing your box-sizing to border box, that makes developing layouts considerably easier, that's just the start of things. It will hold you back from doing more complex and innovative things that are only possible in more modern browsers. If you are supporting IE7 then you should be charging more because you will spend hours trying to get things working in that browser. In my opinion it's not worth supporting something that is so rarely used. Google don't support IE7 or IE8 now in many of their products, Even Microsoft themselves no longer support these legacy browsers. Those hours could instead be spent improving the experience for a much wider audience. Always spend the most time enhancing the things most of your users are likely to benefit from. Don't spend 80% of your time working for 2% of your audience. The worldwide figures are somewhat skewed for IE7 and 8 by China, outside of that country usage for IE8 is less than 4% and IE7 less than 1%. And I imagine a lot of that is web devs simply testing! Anyway if you insist on this path you are probably gonna need an IE7 only stylesheet. <!--[if IE 7]> <body class="ie7"> <![endif]--> <!--[if IE 8]> <body class="ie8"> <![endif]--> <!--[if IE 9]> <body class="ie9"> <![endif]--> <!--[if !IE]> --> <body> <!-- <![endif]--> Then in your css you can target each legacy IE version through the classnames. You will also need to add polyfills for things like media querys, in IE7 and IE8 and the same for HTML5 tags because they don't support that natively either. And you can forget about any of those nice HTML5 APIs like video, audio, localStorage etc. By the way the release of Spartan will have no bearing on old IE versions phasing out, there's been 4 versions of IE since 7. Good browsers like Chrome and Firefox are the reason IE useage has dropped dramatically, then this was further pushed when Microsoft stopped supporting security updates on Windows XP, which meant no more IE8. Users on more modern versions of Windows get IE9/10/11 pre-installed or are prompted to update. Edited February 28, 201511 yr by rbrtsmith
February 28, 201511 yr Author I have an IE7 conditional style but I'm not able to get the layout working, it almost works in IE7 but not the way it should Like I said, I will support IE7 for now, I will create this site backward compatible to IE7, in the future I will only support IE9+
February 28, 201511 yr Probably because your whole layout depends on box-sizing: border-box. remove that and your layout will fail in all modern browsers, but it is not supported in IE7 and there is no polyfill... it can require a LOT of work to change all the layout architecture to work in IE7.
February 28, 201511 yr Author Polyfill may not work but modernizer may ? There is no solution around this issue considering the only issue is with floats on the page with IE7 ?
March 3, 201511 yr If you use any of the new HTML5 elements, like <header>, <aside>, <video> <border-box> or <canvas> remember that some browsers (like IE6/7/8) won't process styles for the new elements until updated. In the case of IE6/7/8 you need to use the javascript conditional comment below (but the styles won't be processed if viewers have javascript/ActiveX disabled and your page layout and styling will not be displayed properly). IE6/7/8 won't process styles for new tags like <header>, <aside>, <video> <border-box> or <canvas> so IE6/7/8 won't recognise width, height, margins or other layout or styling codes but you can make IE6/7/8 process existing styles and display like modern browsers as shown on blancer.com website. Note the conditional comment enclosing the link to the javascript file which enables new HTML5 tags to be styled:- <!--[if lt IE 9]> <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script> <![endif]--> The above comments mean that HTML5/CSS3 can be used even though HTML5 and CSS3 are still in the development stage. However, the javascript file, as far as I can see, merely allows the new tags to be styled, ie background, width, height, margin, font, etc. but doesn't allow the new processing that is required for some of the new tags like <video>, <canvas> that require special processing, but there are often other ways to make IE process the new features (like the object and embed tags for audio and video). It means that you can use the new tags and the IE page will show the elements in the correct places with some styling without disrupting the page layout, but without processing the new features inside the elements unless you find another method. Edited March 3, 201511 yr by Wickham
March 3, 201511 yr If you use any of the new HTML5 elements, like <header>, <aside>, <video> <border-box> or <canvas> remember that some browsers (like IE6/7/8) won't process styles for the new elements until updated. In the case of IE6/7/8 you need to use the javascript conditional comment below (but the styles won't be processed if viewers have javascript/ActiveX disabled and your page layout and styling will not be displayed properly). IE6/7/8 won't process styles for new tags like <header>, <aside>, <video> <border-box> or <canvas> so IE6/7/8 won't recognise width, height, margins or other layout or styling codes but you can make IE6/7/8 process existing styles and display like modern browsers as shown on blancer.com website. Note the conditional comment enclosing the link to the javascript file which enables new HTML5 tags to be styled:- <!--[if lt IE 9]> <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script> <![endif]--> The above comments mean that HTML5/CSS3 can be used even though HTML5 and CSS3 are still in the development stage. However, the javascript file, as far as I can see, merely allows the new tags to be styled, ie background, width, height, margin, font, etc. but doesn't allow the new processing that is required for some of the new tags like <video>, <canvas> that require special processing, but there are often other ways to make IE process the new features (like the object and embed tags for audio and video). It means that you can use the new tags and the IE page will show the elements in the correct places with some styling without disrupting the page layout, but without processing the new features inside the elements unless you find another method. HTML5 is actually an approved W3C standard now Although the older non-html5 browsers will always have to be polyfilled, those browers will not be updated and simply fade away to the web-browser graveyard. IE7 is already there with a sub 1% useage outside of China.
March 3, 201511 yr If you use any of the new HTML5 elements, like <header>, <aside>, <video> <border-box> or <canvas> remember that some browsers (like IE6/7/8) won't process styles for the new elements until updated. In the case of IE6/7/8 you need to use the javascript conditional comment below (but the styles won't be processed if viewers have javascript/ActiveX disabled and your page layout and styling will not be displayed properly). IE6/7/8 won't process styles for new tags like <header>, <aside>, <video> <border-box> or <canvas> so IE6/7/8 won't recognise width, height, margins or other layout or styling codes but you can make IE6/7/8 process existing styles and display like modern browsers as shown on blancer.com website. Note the conditional comment enclosing the link to the javascript file which enables new HTML5 tags to be styled:- <!--[if lt IE 9]> <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script> <![endif]--> The above comments mean that HTML5/CSS3 can be used even though HTML5 and CSS3 are still in the development stage. However, the javascript file, as far as I can see, merely allows the new tags to be styled, ie background, width, height, margin, font, etc. but doesn't allow the new processing that is required for some of the new tags like <video>, <canvas> that require special processing, but there are often other ways to make IE process the new features (like the object and embed tags for audio and video). It means that you can use the new tags and the IE page will show the elements in the correct places with some styling without disrupting the page layout, but without processing the new features inside the elements unless you find another method. I don't think it's necessary to use JS to display html5 elements in IE7 and 8: It should be enough with CSS: header, footer, aside, section, article, main, nav { display:block; } (EDIT: Of course this will not display videos or canvas content) The problem is not the tags but the properties like box-sizing etc. @OP: Instead of supporting IE7 and IE8( (that Microsoft themselves have stoped to support) just make sure that your markup can be fairly readable without CSS at all as an acceptable fall back for ALL legacy browsers. Surely many IE7/8 users must be used to not being able to see websites properly by now. Edited March 3, 201511 yr by Nillervision
March 3, 201511 yr I think you still need the html5shiv JavaScript fallback, looking at the names of the guys who contributed like Paul Irish etc, they wouldn't have made it if it was not necessary. I've not developed in IE7 for ages now, but I would put my trust in a well known industry guru like Paul Irish to know what he's talking about. I'd also use this in conjunction with the HTML5 boilperplate to normalize all these legacy browser differences. I agree totally about the box-sizing issue. I would HATE to have to develop without border-box. Edited March 3, 201511 yr by rbrtsmith
March 3, 201511 yr I looked at the code in the shiv js file I mentioned above (which is the same as polyfilling) and box-sizing and border-box aren't included because they're not elements that can be created with JavaScript, so I think that method is irrelevant and won't work. As Nillervision says, box-sizing and border-box are CSS3 properties, so probably the only way is to create a conditional comment for a separate stylesheet for IE6, 7 and 8 and have different styles for padding and borders and other element widths so that the box sizes look OK. The styles codes for box-sizing and border-box will simply be ignored in those browsers. I hadn't realised that HTML5 and CSS3 were formally approved in October 2014, not so long ago and it took a long time! I know several old people who bought a computer ten years ago and have never updated it So whether you code for IE7 depends on what your target viewers will be, perhaps you anticipate that old people or poor people with old computers will look at your page, so you may need to test in IE7/8 and make sure it's not too jumbled up. Edited March 3, 201511 yr by Wickham
March 3, 201511 yr I don't think it's necessary to use JS to display html5 elements in IE7 and 8: It should be enough with CSS: header, footer, aside, section, article, main, nav { display:block; } I was incorrect here. Sorry if I have caused confusion. Apparently resetting display properties in CSS does not work in IE6-IE8 (works in older versions of most other browsers though) Internet Explorer 6-8 pose a problem as they do not recognize unknown elements; the new elements cannot hold children and are unaffected by CSS. http://www.paulirish.com/2011/the-history-of-the-html5-shiv/ Edited March 3, 201511 yr by Nillervision
March 3, 201511 yr Few things to think about: because there's no box-sizing border-box on IE7 that means your layouts have to be tailoured for this, which hinders the number of possible layouts you can do for all browsers. It will cost more to code for IE7. That money could be better spent improving things for the other 99% of your users. There's very good reasons the big companies out there no longer support IE7 and many are dropping support for IE8. It's madness to spend a large chunk of your time developing for a tiny percentage of your viewers. Spend that time enhancing for the majority instead. Edited March 3, 201511 yr by rbrtsmith
March 3, 201511 yr There is a box-sizing polyfill for IE6/7 - https://github.com/Schepp/box-sizing-polyfill/blob/master/boxsizing.htcIt's a hack, I've never used it so can't say if it works but it's suggested by http://html5please.com/#box-sizingAlso interesting to note... IE8 does not support box-sizing: border-box; with min-width/max-width and min-height/max-height. As others have said, if you're not being paid to do so, there's no point in supporting legacy browsers.Personally I'd drop support for IE9 also. Among others, Google (gmail) no longer supports IE9 and MS will only support the latest version after Jan 2016.Looking at the global usage ..IE 6 (0.1%), 7 (0.16%), 8 (2.82%), 9 (1.91%), 10 (1.45%), 11 (8.07%)There are more people using IE8 than IE9, so doesn't make sense to drop support for one and not the other. Unless your analytics says otherwise, but how many of them are simply choosing not to upgrade.The longer people support legacy browsers the longer people will use them.
March 3, 201511 yr Personally I'm happy to support IE9 for now because it does have pretty good support for things and degrades quite nicely for some css features it doesn't. Apart from flexbox.. But that might be a good enough reason in itself to drop support The main thing I gained from dropping IE8 was that I didnt have to use SVG fallbacks, and transforms work across the board. Transitions do not, but it's rare that you really *need a transition beyond visual enhancement.
March 3, 201511 yr IE7: NO IE8: depends on the client Charge extra for support of these browsers, they can be extremely time consuming and so this should be reflected in the pricing structure for the website.
Create an account or sign in to comment