Using IE conditional statments

  1. Tygra

    Tygra Member Gold Member

    Joined:
    Dec 27, 2007
    Posts:
    207
    Likes Received:
    1
    Local time:
    05:16
    My System
    Loading...

    Hi all, I was given a link to this site which talks about using IE only conditional statments to fix annoying problems that occur in IE, but I'm not sure where to place them in the actual CSS.

    Here's the site.
    How To Create an IE-Only Stylesheet | CSS-Tricks

    To target all version of IE it says to put...

    Code:
    <!--[if IE]>
        <link rel="stylesheet" type="text/css" href="all-ie-only.css" />
    <![endif]-->
    But say I wanted to change something in IE on an hypothetical #leftcolumn where would this conditional statement go in

    Code:
    #leftcolumn {
                    height: 400px;
              }
    Say in Firefox the column I need was 400px, but in IE I needed it a little shorter like 380px. I'm not sure how to assign the conditional statment on that div.

    Thanks guys!!
     
  2. Hengis

    Hengis Proud PCHF'er since 2004 Tech Member Elite Member

    Joined:
    Jan 1, 2004
    Posts:
    39,703
    Likes Received:
    5,037
    Local time:
    05:16
    My System
    Loading...

    Marked as Open.
     
  3. scratj

    scratj New Member Tech Member Elite Member

    Joined:
    Apr 6, 2010
    Posts:
    1,480
    Likes Received:
    98
    Local time:
    00:16
    My System
    Loading...

    Hey Tygra..

    You need a seperate css file for IE as for other browsers..

    so in the page write:

    HTML:
    <link rel="stylesheet" type="text/css" href="regular.css" />
    
    <!--[if IE]>
        <link rel="stylesheet" type="text/css" href="all-ie-only.css" />
    <![endif]-->
    
    Then in the seperate .css files add the necessary attributes that apply.
     
  4. Tygra

    Tygra Member Gold Member

    Joined:
    Dec 27, 2007
    Posts:
    207
    Likes Received:
    1
    Local time:
    05:16
    My System
    Loading...

    So Scratj, you write

    Code:
    [COLOR=#000080]<link rel=[COLOR=#0000ff]"stylesheet"[/COLOR] type=[COLOR=#0000ff]"text/css"[/COLOR] href=[COLOR=#0000ff]"regular.css"[/COLOR] />[/COLOR]
    
    [I][COLOR=#000080]<!--[if IE]>[/COLOR]
        [COLOR=#000080]<link rel=[COLOR=#0000ff]"stylesheet"[/COLOR] type=[COLOR=#0000ff]"text/css"[/COLOR] href=[COLOR=#0000ff]"all-ie-only.css"[/COLOR] />[/COLOR]
    [COLOR=#000080]<![endif]-->[/COLOR][/I]
    on the page I am working on in the head section of the HTML document?

    I already have an embbed style sheet on the page to.
     
  5. scratj

    scratj New Member Tech Member Elite Member

    Joined:
    Apr 6, 2010
    Posts:
    1,480
    Likes Received:
    98
    Local time:
    00:16
    My System
    Loading...

    The first one I posted represents the one you already have.

    Add the second IE ONLY one to your page in the head section.

    Then in that .css file add the stuff that only applies to IE.
     
  6. mitel

    mitel New Member Bronze Member

    Joined:
    Jun 29, 2010
    Posts:
    8
    Likes Received:
    0
    Local time:
    16:16
    My System
    Loading...

    Simply add the following into your html 'head', it doesn't have to be an external css file if you don't want.

    <!--[if IE]>
    <style type="text/css">
    #leftcolumn {
    height: 400px;
    }
    </style>
    <![endif]-->

    You can also use IE conditional comments such as:

    <!--[if lt IE 7]> for everything below IE 7
    <!--[if gt IE 5.5]> for everything greater than IE 5.5

    You can also add the following Meta tag to the head section to force IE8 to render the page as IE7, put before all CSS code though.

    <meta h.t.t.p-e.q.u.i.v="X-UA-Compatible" content="IE=7" />

    Removing the dots of course, I had to put them there to post.
     
  7. scratj

    scratj New Member Tech Member Elite Member

    Joined:
    Apr 6, 2010
    Posts:
    1,480
    Likes Received:
    98
    Local time:
    00:16
    My System
    Loading...

    Hey Tygra, would you consider your question answered to your satisfaction? Please let me know and I will mark this as solved.

    Thanks :cool:
     
Similar Threads
Forum Title Date
Internet and Email New router causing laptop conundrum! Jul 27, 2014
Internet and Email which email id is good for using as a Shared email id ? Apr 15, 2014
Internet and Email what do you advice as an e-mail client [if I am using the right word?] Apr 1, 2014
Internet and Email Using Chrome - question about url showing Jan 26, 2014