IE7 Anything Slider issue

HTML & CSS
1

Hi guys,

I’m hoping someone can help me resolve this annoying problem I have using chris Coyier’s anything slider.

I have several slides that all work in all browsers except IE7,

University of Worcester - Home

If you take a look at the site in Firefox you will see how it should look. (currently there are three of the same image this is not a glitch just me using it for testing purposes). But in ie7 the light blue area which has the text inside, has those area’s overlayed on the first slide. so when you click the next arrow they are out of sync with the slide they should be on.

The featured area is built up of list items with each blue area positioned absolute inside (bottom:0; left:0;). Can anyone help me to figure out why the blue text areas do not stay on their slide and accumulate instead on the first slide?

Any help would be great, the site is due to go live Monday and I’m panicing a little bit…

Thanks

2

Hi,

Can you clarify what the problem is again as it looks the same to me in Firefox and IE7 so I may be looking at the wrong thing :slight_smile:

3

The #homeFeaturedInfoArea is positioned absolute… there’s one for each slide, it looks like the three for each slide are all overlaying on the first one… so when you flick through they are all messed up.

4

Hi,

It looks as though you need to tell IE where to put it.

e.g.


    div#content div#featuredArea div.homeFeaturedInfoArea {
        left:0;
 }

You can’t rely on auto positions in IE especially when you’ve made it emulate IE7.