advanced code snippet search

Posted By

1man on 06/22/07


Tagged

fix ie6 bug position fixed


Versions (?)

Who likes this?

11 people have marked this snippet as a favorite

jonhenshaw
SpinZ
duandan
joseluis
marcoba
vali29
jimmysessions
jonahlyn
revmitcz
smvnet
atulkransingh


IE6 Fixed Position Fix

 / Published in: CSS
 

IE6 Doesn't recognize position: fixed. Here is a little hack to fix it. First you must set IE6 to standards mode. You do this by including a strict doctype in the page.

Once IE6 is in strict mode include the following in a conditional comment. Anything you want fixed, set as absolute. The example sticks an image to the bottom left corner.

Expand | Embed | Plain Text 
  1. /* IE6 Fixed position fix */
  2. html, body {
  3. 	height: 100%;	
  4. 	overflow: auto; 
  5. 	}
  6. body #cornerImage {
  7. 	position: absolute;
  8. 	bottom: 0;
  9. 	}

Report this snippet  

Comments

RSS Icon Subscribe to comments
Posted By: dop3 on February 28, 2009

You can use XHTML 1.0 Transitional too. By using the "important!" declaration, you don't need an conditional comment anymore:

* { margin:0; padding:0; }
html, body {
    height: 100%;
    overflow:auto;
}
body #fixedElement {
    position:fixed !important;
    position: absolute; /*ie6 and above*/
    bottom: 0;
}

tested in ie6, ie7, ie8, ff2, ff3, safari3

You need to login to post a comment.