Please excuse the last remark, I was referring to an updated stylesheet that has superseded the one on the example site. The contact_information is styled as position: relative in our newer attempts at getting it all to work.
We're going to have a long look at the suggestions you've made, thanks again. On Nov 17, 1:22 pm, Manohman <[EMAIL PROTECTED]> wrote: > 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.
