1. Advertising
    y u no do it?

    Advertising (learn more)

    Advertise virtually anything here, with CPM banner ads, CPM email ads and CPC contextual links. You can target relevant areas of the site and show ads based on geographical location of the user if you wish.

    Starts at just $1 per CPM or $0.10 per CPC.

ie conditionals in style sheet

Discussion in 'CSS' started by artdog, Jan 6, 2007.

  1. #1
    I have a habit of using one or two IE conditional styles in my sites as it greately speeds up my development time. I am not comfortable however putting any styles in the header of my pages but I can't figure out the syntax to put them in my style sheet.

    Can someone show me how to do this? I would greatly appreciate it.

    Sincerely,
    Artdog
     
    artdog, Jan 6, 2007 IP
  2. wallity

    wallity Peon

    Messages:
    5
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #2
    You can't put them directly in the stylesheet itself. What you need to do is create one "standards compliant" stylesheet with the styles you want all browsers to see, then an "IE only" stylesheet that overrides those set in the other stylesheet containing workarounds for IE. Then, what you do is:

    <link rel="stylesheet" type="text/css" href="standard.css">
    <!--[if IE]>
    <link rel="stylesheet" type="text/css" href="ie.css">
    <![endif]-->
    Code (markup):
    This works because of the cascade - the lower stylesheet overrides any stylesheets that come before it. Hope that helps
     
    wallity, Jan 6, 2007 IP
  3. EvilivE

    EvilivE Peon

    Messages:
    23
    Likes Received:
    2
    Best Answers:
    0
    Trophy Points:
    0
    #3
    I also found that ie7 is more compliant, so to address older versions of ie you can use this
    
    <!--[if lt IE 7]>
         <link rel="stylesheet" type="text/css" charset="utf-8" href="ie.css" media="screen" />
    <![endif]-->
    
    Code (markup):
     
    EvilivE, Jan 7, 2007 IP
  4. orangelad

    orangelad Peon

    Messages:
    62
    Likes Received:
    3
    Best Answers:
    0
    Trophy Points:
    0
    #4
    And that's also the Microsoft-approved way of doing things! Woohoo!
     
    orangelad, Jan 10, 2007 IP
  5. kk5st

    kk5st Prominent Member

    Messages:
    3,497
    Likes Received:
    376
    Best Answers:
    29
    Trophy Points:
    335
    #5
    That's not exactly a ringing endorsement. Besides being a non-standard proprietary method, it separates the IE specific hack from the standard selector/property. That makes maintenance and debugging more difficult. The conditional comment is a truly ugly hack; one to be avoided if at all possible.

    If you just must use it, plan well. Keep the IE hacks in the same order as the original standard stylesheet, and be sure to add comments that explain and point to the original standard selector and property. The standard selector should also have a comment that points to the hack. Code and comment as if the person who will maintain the document is a violent psychotic who knows where you live.

    cheers,

    gary
     
    kk5st, Jan 10, 2007 IP
  6. orangelad

    orangelad Peon

    Messages:
    62
    Likes Received:
    3
    Best Answers:
    0
    Trophy Points:
    0
    #6
    It was meant as a joke, Gary. =P
     
    orangelad, Jan 12, 2007 IP
  7. kk5st

    kk5st Prominent Member

    Messages:
    3,497
    Likes Received:
    376
    Best Answers:
    29
    Trophy Points:
    335
    #7
    Oops, I missed the [sarcasm][/sarcasm] tags. :( :p

    cheers,

    gary
     
    kk5st, Jan 12, 2007 IP
  8. artdog

    artdog Peon

    Messages:
    13
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #8
    Thanks guys for the help. I am a "If it works its ok with me" kind of guy and anything that can speed my development and prevent my clients complaining about over billing works for me.
     
    artdog, Jan 13, 2007 IP