IE 7 bug with elements positioned with negative margins #101

maraujop opened this Issue Jan 17, 2011 · 3 comments


None yet
2 participants


I have a site structure that looks like:

<div id="content">
   <div id="submenu">

The submenu is positioned using CSS:

margin: -10px -10px 10px -10px;

It has a zoom: 1; position: relative. When using PIE, IE8 renders the submenu in the right place, but IE7 and probably 6 (not tested) renders it without considering the negative margins, so it's displayed downwards. Well, actually the only margin not taken into account is the top margin, left and right margins work. This breaks the format of some other divs that go after the submenu.

I can fix this changing the padding of content, and I will. But I'm sure you will like to be aware of this.

Best regards, thanks
Miguel Araujo

I forgot to say that IE7 renders the submenu in the right place without using PIE.

After looking at it thoroughly I can say it is not related to the negative margin, as I have changed the padding of content and removed the margin-top from submenu. However it is still hapenning, the box is a little bit downwards and the text upwards.

The submenu has a box-shadow and border-radius set. I have realized that setting any of them changes the margins or paddings. Some other pages format change also when using PIE, only in IE7. Not sure why.


lojjic commented Apr 26, 2011

Can you try adding the -pie-poll:true property to the element and see if that helps?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment