Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP

Loading…

IE 7 bug with elements positioned with negative margins #101

Open
maraujop opened this Issue · 3 comments

2 participants

@maraujop

Hi,

I have a site structure that looks like:

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

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

@maraujop

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

@maraujop

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
Owner

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
Something went wrong with that request. Please try again.