mlms13 / Navtacular

A horizontal navigation bar with menus that doesn't depend on Javascript for core functionality.

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

IE7 :hover background is off

mlms13 opened this issue · comments

IE7 has a bug when using backgrounds, line-height, and position: relative all at the same time: http://jsfiddle.net/WrYJy/1/

As you can see, the background starts at the top of the text instead of the top of the box. This bug affects our ul.navbar > li > a elements on :hover. Since the position: relative is only used for generated content -- and IE7 doesn't support generated content -- it should be safe to do something like this:

ul.navbar > li > a {
    .no-generatedcontent & {
        position: static;
    }
}

Even better, it looks like a simple zoom: 1 is all it takes to fix this. ...stupid hasLayout nonsense...