Previous Message
Next Message

MSIE Win problem with absolute positioning?

Sent by Bruce L Giles on 26 February 2006 19:07


As I'm sure you've heard many times before, I have a design which 
seems to work exactly as I expected and wanted, everywhere except 
MSIE 6 for Windows. (And possibly MSIE 5 Win, which I haven't tested 
yet.)

The design is a three-column layout which uses absolute positioning 
for the right-hand sidebar. The CSS for the sidebar looks like this:

	#sidebar {
		width: 150px;
		padding: 20px;
		color: white;
		position: absolute;
		top: 0;
		right: 0;
		background: #f00; /* temporary background */
		}

I've previously established the context in a containing div using 
{position: relative;}. The containing div is contained inside another 
div with a 12-pixel right border. Here's the page, which contains 
both the XHTML and CSS, and validates for both:

<http://www.blueflashsoft.com/csstest/bugdemo1.html>

Note the bright red block in the sidebar. It should fit exactly 
within the top of the sidebar, and it does in the latest versions of 
Safari, Camino, Firefox, OmniWeb and IE 5 Mac. But in IE 6 Win, it 
overlaps the borders of the containing block's containing block.

I first thought this was related to IE's box model problem, but this 
is IE 6, not IE 5, so it's apparently something else. I searched the 
web, but if it's a known problem, I'm apparently using the wrong 
search terms, because I'm not finding it.

Is this actually a CSS bug in IE 6 Win, or have I improperly 
specified something in the CSS? I have managed to hack the CSS to 
make it work, as on this second page:

<http://www.blueflashsoft.com/csstest/bugdemo2.html>

but I really hate to resort to a CSS hack if I don't have to. Does 
anyone have any suggestions? Also, I no longer have access to any 
versions of IE 5 Win. Does the problem exist there as well, and if 
so, is the fix the same?

-- 
Bruce L. Giles, Oak Ridge, TN  USA  --  [EMAIL-REMOVED]>
______________________________________________________________________
css-discuss [EMAIL-REMOVED]]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Previous Message
Next Message

Message thread:

Possibly related: