Steve, thankyou for your prompt reply and for suggesting relevant problems that were beyond what we had noticed ourselves.
One thing came to our attention immediately: 'contact_information' is styled position: relative yet firebug is showing it as position: absolute. This is very confusing. On Nov 17, 1:02 pm, "Steve Onnis" <[EMAIL PROTECTED]> wrote: > Manohman > > Element id "contact_information" is positioned absolutly which i imagine is > making the div float above everything. Also because you are using other > absolute positioned elements you may have to use some z-index values, > especially in IE because a lot of the times it doesnt play nice. > > Another thing to look at is to nest your containers a bit more. You are > targeting an element on the same level as the other elements on the DOM. > Create a fresh container and position THAT absolute and then nest everything > in there. > > <div> -- absolute > <div> -relative > <div> - sliding element > > Remember, the further down the DOM the element is the higher the stacking > order. > > Also, be careful with your ajax content. I notices you are oulling in meta > tags and title tags and link tags with your responseText. This is going to > play havock with your DOM moving forward. > > Some things to look at > > Steve > > -----Original Message----- > From: [email protected] > > [mailto:[EMAIL PROTECTED] On Behalf Of Manohman > Sent: Monday, 17 November 2008 10:47 PM > To: MooTools Users > Subject: Mootools IE6 overflow bug > > Hi all, > > I've detailed this problem before but had no suggestions as I think my > description was too drawn out. I will try and be more concise this > time as I'm still having the problem and I'm getting really frustrated > with it. > > I've uploaded a working example of the problem to:http://iol.ie/~jtol/fxslide/ > > If you clock the 'contact' button in IE6 or IE7 the content that > slides out (fx.slide) will float above the entire menu content on the > left, rendering it unuseable. It works fine in Firefox and Safari. > > This problem has been detailed as a bug in IE that incorrectly > overflows content that has been a position of 'relative'. All the > solutions are not working for me as they seem specific to simpler > basic html and css pages that don't involve javascript or mootools. I > believe the problem lies in an additional 'wrapper' div that fx.slide > adds outside the sliding content. One suggestion mentioned I should > not use the default wrapper and try and create my own that I can style > and so work around the bug. I attempted to do so by changing the > following: > > <div id="sliderwindow"> </div> > > to: > > <div id ="newwrapper"> > <div id="sliderwindow"> </div> > </div> > > and in my javascript I tried adding a wrapper option to fx.slide to > point to this new div: > > var mySlide = new Fx.Slide('sliderwindow',{wait: false, duration: > 1000, mode: 'horizontal', wrapper: 'newwrapper'}); > > But firebug is showing me that there's still a regular default 'div' > wrapper around the sliderwindow and not a 'newwrapper', so the wrapper > is not working. Of course, the wrapper may not be the cause of my > problems but it's my only lead so far. Any suggestions? Thanks.
