Results 1 to 3 of 3

Thread: [DHTML] Old Internet Explorer, Different Stylesheet

  1. #1
    Join Date
    Nov 2007
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Post [DHTML] Old Internet Explorer, Different Stylesheet

    1) CODE TITLE: Old Internet Explorer, Different Stylesheet

    2) AUTHOR NAME/NOTES: Rik Dekker

    3) DESCRIPTION: Internet Explorer 6 and below dont support the position: fixed; attribute in CSS. Therefore if you use the attribute it will really mess up your design.

    So this script detects if you use Internet Explorer 6 or below and then attatches a different stylesheet.

    In any other case (Opera, Safari etc.) it just loads the normal stylesheet.

  2. #2
    Join Date
    Jun 2005
    Location
    英国
    Posts
    11,876
    Thanks
    1
    Thanked 180 Times in 172 Posts
    Blog Entries
    2

    Default

    Browser detection is bad (and, done like this, inaccurate). If you need to do this, use conditional comments:
    Code:
    <!-- [if IE < 7]>
      <link type="text/css" rel="stylesheet" src="ie.css">
    <![endif]-->
    <!--[if !IE]>-->
      <link type="text/css" rel="stylesheet" src="other.css">
    <!--<![endif]-->
    Twey | I understand English | 日本語が分かります | mi jimpe fi le jbobau | mi esperanton komprenas | je comprends franšais | entiendo espa˝ol | t˘i Ýt hiểu tiếng Việt | ich verstehe ein bisschen Deutsch | beware XHTML | common coding mistakes | tutorials | various stuff | argh PHP!

  3. #3
    Join Date
    Sep 2007
    Location
    The Netherlands
    Posts
    1,881
    Thanks
    49
    Thanked 266 Times in 258 Posts
    Blog Entries
    56

    Default

    Your text file doesn't make clear whether you know how to emulate 'position: fixed' in IE<7.
    Using the underscore hack, you could have something like the following for a fixed position on top in all browsers:
    <div style="position:fixed;left:0;width:100%;height:35px;background:white;top:0px; padding:2px;_position:absolute;_top:expression(eval(document.compatMode && document.compatMode=='CSS1Compat') ? documentElement.scrollTop+screen.height*0 : document.body.scrollTop+screen.height*0)"></div>

    But we don't like hacking, so we could use the above coding in conditional statements (without the underscores), as suggested by Twey.

    Important: just to make sure that there is no 'trembling' of the fixed div in IE when you scroll down, the body should be styled as:
    body{background:url(foo) fixed;}

    Arie Molendijk.

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •