1276 posts
  • Affiliate Level 4
  • Author Level 6
  • Collector Level 3
  • Community Superstar
+20 more
ChristineWilde
Envato team
says

Hi guys and gals,

I’m having a problem with my personal site in Internet Explorer 7. The slider on the home page looks screwy. If you check it out in Chrome or Firefox you’ll see what the slider is supposed to look like.

Can anyone point me in the right direction with this?

www.wildemedia.co.uk

1182 posts
  • 6 Years of Membership
  • Affiliate Level 1
  • Collector Level 2
  • Exclusive Author
campolar
says

Applying a negative margin-left might fix it :)

1276 posts
  • Affiliate Level 4
  • Author Level 6
  • Collector Level 3
  • Community Superstar
+20 more
ChristineWilde
Envato team
says

But wouldn’t it look wrong in all the other browsers? It looks perfect in Chrome, Opera, Firefox, IE8 and Safari it’s just IE7 .

2337 posts
  • Affiliate Level 5
  • Author Level 6
  • Collector Level 2
  • Trendsetter
+7 more
CreativeMilk
says
But wouldn’t it look wrong in all the other browsers? It looks perfect in Chrome, Opera, Firefox, IE8 and Safari it’s just IE7 .

Simple just ad an * for the css( *margin-left:-2px) this will only affect IE7

1787 posts
  • Winner
  • Author Level 4
  • Exclusive Author
  • 5 Years of Membership
+2 more
VisualSharing
says

For a number of reasons, I’d recommend avoiding CSS “hacks” and instead using an inline conditional comment for IE7 :

<!--[if lte IE 7]>
<style type="text/css">
    div { margin-left: -2px; }
</style>
<![endif]-->
1276 posts
  • Affiliate Level 4
  • Author Level 6
  • Collector Level 3
  • Community Superstar
+20 more
ChristineWilde
Envato team
says

Thanks for the replies!

That doesn’t seem to have work unfortunately. I tried both ideas.

343 posts
  • Top Monthly Author
  • Weekly Top Seller
  • 6 Years of Membership
  • Featured Author
+6 more
JackHowell
says

Unfortunately I am using my macbook at the moment so don’t have access to IE7 (though I am curious so I will take a look on my pc when I get a chance).

An alternative way of thinking might be that IE7 is actually displaying correctly [don’t shoot] and that other browsers are being too lenient? I know it is unusual to think of IE being correct about something but because it is less forgiving it may show up an actual bug others are overlooking.

If you can, might even be worth looking at it in IE6 – if they same bug appears (though you will get a lot more as there are quite a few margined and floated divs without ‘display: inline’) then it might be a common IE problem.

Also try simplifying parts of your code: does it need to float, margin, position etc? Something (like the slideshow frame) that is ‘positioned: absolute’ doesn’t need to float as it is effectively no longer in the flow of the page. Also try using ‘left: XXpx’ and ‘top: XXpx’ rather than margin for your absolutely positioned divs as margin is not ideal (and could be causing IE to fall over).

Good luck! Might be able to come back to you with an exact reason later! I know how you feel though as I absolutely hate when this happens. :)

Edi: lovely site btw.

1276 posts
  • Affiliate Level 4
  • Author Level 6
  • Collector Level 3
  • Community Superstar
+20 more
ChristineWilde
Envato team
says

Thanks Jack,

Yes it is very annoying especially when I’m a freelance web designer if people view it in IE7 they will instantly leave because of this issue.

I copied the CSS from the sliders original files and didn’t change anything as it looked fine in the other browsers it wasn’t until my boss pointed it out that I knew it existed.

I have got IE6 on a virtual machine on my computer but I’m dreading looking at it.

I will try left and top positions to see if this changes anything.

Glad you like it, it has come a long way to get where it is today I think this must be about the 6th re-design! :)

2337 posts
  • Affiliate Level 5
  • Author Level 6
  • Collector Level 2
  • Trendsetter
+7 more
CreativeMilk
says

Try to give the div#slide-holder a float left

1182 posts
  • 6 Years of Membership
  • Affiliate Level 1
  • Collector Level 2
  • Exclusive Author
campolar
says
Thanks for the replies! That doesn’t seem to have work unfortunately. I tried both ideas.

Did you try more than -2px? Dumb question, but possible?

And also try what mark said…

by
by
by
by
by
by