Is it possible to code for IE7 without hacks?

Discussion in 'Web Design and Development' started by Yamcha, Jun 23, 2012.

  1. Yamcha macrumors 68000

    Mar 6, 2008
    Hi Guys,

    Just about finished coding my portfolio, It's looking pretty pixel perfect on all browsers - Safari, Chrome, Firefox, Opera, Internet Explorer 8+.. The CSS and XHTML is W3C Valid with no errors..

    But It's still broken on IE7, I've been Googling around and there are people saying that you can code for IE7 without the use of hacks..

    Can anyone confirm if this is true? Should I even bother coding for IE7?

    Appreciate your advice =D
  2. designguy79 macrumors 6502

    Sep 24, 2009
    I still pay attention to IE7 so that important things at least work.

    The best way to handle the quirks of IE, and differences between IE versions, without using hacks, is conditional comments.

    Have fun!
  3. NathanCH macrumors 65816


    Oct 5, 2007
    Stockholm, Sweden
    It definitely depends on what code you're using. There are methods to do certain things without using 'hacks'. Hacks aren't so bad either, so don't be worried about using them.

    Which areas of your code are not working proper in IE7?
  4. Dolorian, Jul 8, 2012
    Last edited: Jul 8, 2012

    Dolorian macrumors 65816


    Apr 25, 2007
    A hack free way is to use conditional comments to add clases to your <html> that allow you to trigger any version of IE with CSS, for example putting your oppening <html> tag like this:

    <!--[if IE 7 ]><html class="ie7"> <![endif]-->
    <!--[if IE 8 ]><html class="ie8"> <![endif]-->
    <!--[if IE 9 ]><html class="ie9"> <![endif]-->
    <!--[if (gte IE 9)|!(IE)]><!--><html> <!--<![endif]-->
    Will render it with the appropriate class deepening on which browser is viewing the page, for instance if the user is using IE7, then the <html> tag he gets would be:

    <html class="ie7">
    With this in place, you can now write CSS rules that target only IE7, for instance let's say you need to change the right margin of the navigation in IE7, you could write something like:

    .ie7 .nav { margin-right: 10px; }
    And like so for any other element you need to adjust in IE7 or any other version of IE.
  5. Flood123 macrumors 6502a


    Mar 28, 2009
    Living Stateside
    Evoken speaks truth. Here is an article by paul irish on the subject matter. Read and enjoy.

Share This Page