|
Welcome
Guest
|
Register
| Login
|
|
|
| Index | Recent Threads | Unanswered Threads | Who's Online | User List | Help |
Killersites.com Forum
General Web Design
CSS - Styling your pages with Cascading Style Sheets.
Thread: Conditional Comments or Hacks?
|
| No member browsing this thread |
|
Thread Status: Active Thread Type: Sticky Thread Total posts in this thread: 23
|
|
| Author |
|
LSW
Advanced Member USA Joined: Nov 27, 2003 Post Count: 6285 Status: Offline |
This is not a right or wrong thread, just two way of doing things and the reason for that. So hacks are bad - most of us agree. A hack is a code style that takes advantage of bugs and mistakes in browsers. If the browser is fixed, the hack does not work and the site is likely broken. Discussing this in another forum a comment was made that rings true and should be mentioned here. So a few points to consider: Hack Con - Requires a mistake or bug in a browser to work, it that is fixed the hack fails. Con - Makes the CSS not valid Pro - A hack is placed alone in the CSS, when the CSS is external this means you need but remove it from the style sheet to be rid of it. Condition Comments Con - They have to be placed in your markup, every single page... Con - They muck up pure structured code & invalidate your code Con - You are playing to the whims of the most popular browser yes, but you are writing incorrect code due to one single user agent out of the dozens that you may have visit your site, logical to cater to one single broken user agent? Pro - You are creating styles for IE in a form that only IE will read leaving your CSS pure for standards based browsers. Conclusion The choice is yours, would you rather have pure structure or pure CSS? Would you rather write a hack in a single document or would you rather write a comment/s in every page of your site? Course with the smart use of Templates or includes you can limit this. So this is not a do or do not, simply consider this and what comments will follow and make an informed decision whether to use Hacks or Comments. IE7 has improved but there are still some problems with IE7 and Opera 9 and a whole new series of Hacks will be needed. IE7 has blocked the * html hack which was often used to correct Layout problems in IE, however those layout problems have not been corrected, they still exist bit the hack does not. ---------------------------------------- [Edit 1 times, last edit by LSW at May 2, 2006 8:39:52 PM] |
||
|
|
shelfimage
Advanced Member USA Joined: Mar 24, 2005 Post Count: 3000 Status: Offline |
IE7 has blocked the * html hack which was often used to correct Layout problems in IE, however those layout problems have not been corrected, they still exist bit the hack does not. HA-figures! I'll have to stick with Both for now. Some hacks don't break things. I personally don't care if the IE conditional statement isn't pure. And guess what? The W3C validator ignores the fact that it isn't correct in strict doc types. Hacks like these are used everyday and don't break anything: body { text-align:center; /*IE 6 and earlier doesn't properly handle text-align:center it centers everything, not only text */ min-width:760px; } #wrapper { width:720px; margin:0 auto; /*IE 5.xx and IE 6 don't like auto margins*/ text-align:left; /* "hack" for IE5.xx and 6 to align the text left */ } And there is a hack needed for Netscape, for rare cases, that will prevent the left side of the wrapper from sliding off the page. It occurs when the browser window is smaller than the html page wrapper. (I said it was rare... but could happen) So, min-width:760px added to the body { } is the hack needed to correct this and it doesn't cause any problems elsewhere because it is ignored by IE (probably not ignored by FFox but has no consequence). I'm not advocating hacks, but recognize that there is harmless css that can help some browsers along. CSS that should be forward compatible (ignored by new browsers) and not screw things up later. More tools in my toolbox, the better.  ---------------------------------------- "The art of life lies in a constant readjustment to our surroundings." -Okakura Kakuzo Save the developers<!> Maine Webworks |
||
|
|
admin
Advanced Member Joined: Jun 14, 2003 Post Count: 2940 Status: Offline |
One point was missed: Hacks have inconsistent application - they may work in one browser version and not another; thus what happens if you use a hack to make something work in IE6 but causes you problems in IE7? You either have to find another hack that will work in both or you have to use conditional comments. That said, I have found CSS layouts that seem to work in both IE6, IE7 and the other major browsers without the use of hacks or IE conditional comments. But, they introduce structural code that has no other purpose than to make the layouts work - sorta like 1 pixel gifs. In terms of consistency and stability (you know 100% that it will work,) IE conditional comments are the way to go .. there is no question about that. - Whether code validates or not (because of the presence of IE conditional comments,) is so low of the scale of importance, that it is on the verge to total ridiculousness. If you're really concerned about conditional comments (that may have to be removed in say what, 5 years(?) ...) just 'include' them with a server-side include and that will take care of the maintenance problem. - This overly anal concern for code-validation, has really done the profession of web design a disservice. All these pro code validators should take a couple of years of software design, and they will finally see how overboard they went ... - One last thing: Be much more concerned (over 'pureness') that your code:
The Web standards are a suggested set of rules - they are not the 'ten commandments'. No one is bound to follow them and things will change in time - guaranteed! Aspects will be added, and other elements will fall into disfavor as people/nerds, discover better ways of doing things. The Web standards are not imutable ... they can change and will change over time. I betcha that they will add the XMLHTTP object (AJAX) to the Web standard sometime soon! Stefan ---------------------------------------- Stefan Mischook Video Tutorial Store | Web Templates ---------------------------------------- [Edit 1 times, last edit by admin at May 3, 2006 12:00:37 AM] |
||
|
|
LSW
Advanced Member USA Joined: Nov 27, 2003 Post Count: 6285 Status: Offline |
Yes, theretically browsers do ignore IE comments... but will everything, will those in the future? It is possible that another form of user agent does react icorrectly to CC, so adding non-standard code can be as damaging as hacks. Any time you add anything that is not standard there is no guarentee that a user agent will not react to it and break. Yes Standards are only a guideline, but it is a guideline that the briwsers are meant to react to in the same way, add something that is not standard and you have to hope that the developer of that user agaent as taken non-standard code into consideration. As for not all hacks breaking sites... Example: The * html hack. This hack is used to correct layout problems with IE. IE 7 has blocked the * html hack, but it has not corrected all the Layout problems. The result is that my rollovers do not work. I have written on this before. Rollovers are essential to accessibility, long lists of links, or a user with poor eyesight or cognitive problems can easily get lost when tabbing through the navigation with the tab key. Rollovers are important to make their position known in the menu. Normally you would use the :focus psuedo-class to do this, but it is not supported by IE. So the * html hack is used with :active to recreate this effect. However this is blocked in IE7 and IE7 would seem to still not support :focus either. This is a serious flaw in IE7 (which is still an excellent improvement over IE6). I am looking for a workaround, it will likely come in the way of a new generation of Hacks. But the fact at the moment is that Current Hacks and Conditional Comments both cannot solve this problem. The first new generation hacks are now appearing, Brothercakes "The Triple-X hack - an exclusive CSS filter for IE7" (note this is actaully more a filter than a true hack) is to correct flaws only found in IE7 and Opera 9, as usual Mozilla based browsers are not effected. Although IE7 is in my mind a great improvement, it still requires extra work and falls behind Mozilla based browsers. |
||
|
|
shelfimage
Advanced Member USA Joined: Mar 24, 2005 Post Count: 3000 Status: Offline |
More to consider. If you're really concerned about conditional comments (that may have to be removed in say what, 5 years(?) ...) just 'include' them with a server-side include and that will take care of the maintenance problem. Using conditional comments correctly (in my opinion) will not cause future IE versions hearburn. For example, I see a lot of cc written, <!--[if IE]>This says if IE - ANY version of Internet Explorer. A better use is, <!--[if lte IE 6]>This says if Less Than or Equal to IE 6 Let's face it, most sites are not currently being written for IE5 or 5.xx. And, if so, most of the hacks for those will not break a site when viewed in IE6. So including a different set of CSS rules in a targeted cc should not have any future impact on newer IE browsers. IE browsers can be targeted individually, if needed. <!--[if gte IE 7]>, <!--[if IE 5]>, <!--[if !gt IE 6]>, Etc. see: http://msdn.microsoft.com/workshop/author/dhtml/overview/ccomment_ovw.asp Yes, theretically browsers do ignore IE comments... but will everything, will those in the future? It is possible that another form of user agent does react icorrectly to CC, so adding non-standard code can be as damaging as hacks. Not likely because..., well here are some examples. HTML comments start with <!-- and end with -->. True the whitespace before and after the comments contents must exist to be "Standard." ASP Includes start with <!-- and end with -->. <!--#include virtual="/content.inc"--> ...granted this is parsed server-side. In terms of consistency and stability (you know 100% that it will work,) IE conditional comments are the way to go .. there is no question about that. conditional comments do not solve the bugs found in Opera 9 and earlier. see: http://www.gtalbot.org/BrowserBugsSection/ But, they introduce structural code that has no other purpose than to make the layouts work - sorta like 1 pixel gifs. CSS is a lesser evil methinks Any time you add anything that is not standard there is no guarentee that a user agent will not react to it and break. Unfortunately, anytime using something that is "Standard" there is no garauntee it will work... As for not all hacks breaking sites... Example: The * html hack. This hack is used to correct layout problems with IE. IE 7 has blocked the * html hack, but it has not corrected all the Layout problems. Depends on a person's definition of breaking a site I suppose. @LSW I've read about your rollover :focus concerns in IE. But, I'm not sure that a hack is needed. I get :focus to work in both FF and IE. see:fabricwarehouse.com and tab through it using IE and FF and let me know if we are talking about the same thing... thanks.  ---------------------------------------- "The art of life lies in a constant readjustment to our surroundings." -Okakura Kakuzo Save the developers<!> Maine Webworks |
||
|
|
admin
Advanced Member Joined: Jun 14, 2003 Post Count: 2940 Status: Offline |
The smart thing about IE conditional comments is that they are (for all intents and purposes,) just comments, and will be treated as comments by all other browsers. Only IE will check to see if they are special IE conditional comments ... unless some dimwitted nerd decides to make a browser that looks for them. This practically has no chance of happening btw. To the point: because of the above, IE conditional comments will never fail you. So if you want forward compatible sites with no hassles - use IE conditional comments. - Regarding Opera: how many people use Opera... what, 10? Who cares about Opera. ---------------------------------------- Stefan Mischook Video Tutorial Store | Web Templates ---------------------------------------- [Edit 1 times, last edit by admin at May 3, 2006 3:57:59 PM] |
||
|
|
LSW
Advanced Member USA Joined: Nov 27, 2003 Post Count: 6285 Status: Offline |
Yes, theretically browsers do ignore IE comments... but will everything, will those in the future? It is possible that another form of user agent does react icorrectly to CC, so adding non-standard code can be as damaging as hacks. Not likely because..., well here are some examples. HTML comments start with <!-- and end with -->. True the whitespace before and after the comments contents must exist to be "Standard." ASP Includes start with <!-- and end with -->. <!--#include virtual="/content.inc"--> ...granted this is parsed server-side. Ahhh, but consider that <!-- --> is SGML, it can not be used in XML/XHTML (served correctly of course). So coments are not proof of not being reated with. Well Opera is gaining followers now that it is free (would have sooner if it had been free) and it is the far suppior browser for those with disabilities. It should not ignored. Unfortunately, anytime using something that is "Standard" there is no garauntee it will work... wink ut then it is the browser that is broken and garbage. IE is the only browser that can continually be junk and still get used! ROFL @LSW I've read about your rollover :focus concerns in IE. But, I'm not sure that a hack is needed. I get :focus to work in both FF and IE. This is being discussed at Accessify Forum. IE does not support :focus, well known fact. However it does (incorrectly?) support :active in a way that reflects :focus as Cerbera points out. I will be trying this in the site I am working on now. I cannot test the site as you ask now as I seem to have a Trogan called Hyperlink that is adding links to web sites and such so I cannot use IE until I get it cleaned up. |
||
|
|
shelfimage
Advanced Member USA Joined: Mar 24, 2005 Post Count: 3000 Status: Offline |
I cannot test the site as you ask now as I seem to have a Trogan called Hyperlink that is adding links to web sites and such so I cannot use IE until I get it cleaned up. That sucks.  PS Thanks for the Accessify link ---------------------------------------- "The art of life lies in a constant readjustment to our surroundings." -Okakura Kakuzo Save the developers<!> Maine Webworks ---------------------------------------- [Edit 1 times, last edit by shelfimage at May 4, 2006 9:17:56 AM] |
||
|
|
LSW
Advanced Member USA Joined: Nov 27, 2003 Post Count: 6285 Status: Offline |
Checked in IE7 and looks good, the tab rollovers as well as the site in General. I don't know if it is intentional, your mouse hover rollover gets light, the tab rollover actually gets darker, I assume as IE7 readsactive and focus as the same as mentioned above, it is giving it the activecolor rather than the hover color. But it does indicate where the focus is at that moment, so looking good. |
||
|
|
shelfimage
Advanced Member USA Joined: Mar 24, 2005 Post Count: 3000 Status: Offline |
Yep, that's right.... Tabbing through the left menu in IE will show the :active CSS rules which is different than the hovering rules. I have :focus and :active sharing the same rules (I think) throughout the site so tab navigations works the same for IE and FF. I originally used :active and :focus for the visual effect a hyperlink has while a mouse click is held for that brief moment before it is released. Am I saying that right... A mouse click has a "down" and an "up" action. So while it is down, the link shows the active and focus properties. ...That is until being exposed to accessiblity and sthese things called screen readers... Now I try to be aware of the cool and the useful.I suppose I could put :active into an IE only css using I CC's, but that would be silly. ---------------------------------------- "The art of life lies in a constant readjustment to our surroundings." -Okakura Kakuzo Save the developers<!> Maine Webworks |
||
|
|
|
|
Current timezone is GMT May 20, 2013 5:13:44 AM |
