1276 posts
  • Envato Staff
  • Reviewer
  • United Kingdom
  • Sold between 10 000 and 50 000 dollars
  • Won a Competition
  • Repeatedly Helped protect Envato Marketplaces against copyright violations
  • Gold Mo Grower
  • Author had a File in an Envato Bundle
  • Most Wanted Bounty Winner
+12 more
ChristineWilde Reviewer 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
  • Bought between 10 and 49 items
  • Exclusive Author
  • Has been a member for 4-5 years
  • Referred between 1 and 9 users
campolar says

Applying a negative margin-left might fix it :)

1276 posts
  • Envato Staff
  • Reviewer
  • United Kingdom
  • Sold between 10 000 and 50 000 dollars
  • Won a Competition
  • Repeatedly Helped protect Envato Marketplaces against copyright violations
  • Gold Mo Grower
  • Author had a File in an Envato Bundle
  • Most Wanted Bounty Winner
+12 more
ChristineWilde Reviewer 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 .

2322 posts
  • Repeatedly Helped protect Envato Marketplaces against copyright violations
  • Author had a Free File of the Month
  • Bought between 10 and 49 items
  • Europe
  • Exclusive Author
  • Has been a member for 5-6 years
  • Referred between 100 and 199 users
+1 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

1734 posts
  • Exclusive Author
  • Won a Competition
  • Sold between 5 000 and 10 000 dollars
  • Has been a member for 4-5 years
  • Referred between 1 and 9 users
  • Bought between 1 and 9 items
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
  • Envato Staff
  • Reviewer
  • United Kingdom
  • Sold between 10 000 and 50 000 dollars
  • Won a Competition
  • Repeatedly Helped protect Envato Marketplaces against copyright violations
  • Gold Mo Grower
  • Author had a File in an Envato Bundle
  • Most Wanted Bounty Winner
+12 more
ChristineWilde Reviewer says

Thanks for the replies!

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

343 posts
  • Bought between 10 and 49 items
  • Exclusive Author
  • Has been a member for 5-6 years
  • Referred between 50 and 99 users
  • Sold between 10 000 and 50 000 dollars
  • United Kingdom
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
  • Envato Staff
  • Reviewer
  • United Kingdom
  • Sold between 10 000 and 50 000 dollars
  • Won a Competition
  • Repeatedly Helped protect Envato Marketplaces against copyright violations
  • Gold Mo Grower
  • Author had a File in an Envato Bundle
  • Most Wanted Bounty Winner
+12 more
ChristineWilde Reviewer 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! :)

2322 posts
  • Repeatedly Helped protect Envato Marketplaces against copyright violations
  • Author had a Free File of the Month
  • Bought between 10 and 49 items
  • Europe
  • Exclusive Author
  • Has been a member for 5-6 years
  • Referred between 100 and 199 users
+1 more
CreativeMilk says

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

1182 posts
  • Bought between 10 and 49 items
  • Exclusive Author
  • Has been a member for 4-5 years
  • Referred between 1 and 9 users
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