CSS: IE zoom breaks navigation

2 replies
  • WEB DESIGN
  • |
I've got a site template just about finished, with all CSS hacks and such in place for proper cross-browser display. There is one problem, though that I can't seem to wrap my head around.

IE has this feature where instead of increasing text size, it actually zooms in on the whole page, making everything bigger. This is fine, but when the zoom level goes above or below 100%, the text in the navigation and the tabs displays incorrectly. The errors are mostly things like padding/margin values being lost and horizontal text misalignment in the dropdown menus.

From what I've researched, it is related to something in IE called "hasLayout." Being more designer than programmer, this concept escapes me. Can anyone clearly explain hasLayout, or point me to a good explanation on the web?

Many thanks in advance,
Pete
#breaks #css #display error #haslayout #intenet explorer #navigation #zoom
  • Profile picture of the author Pete Janelle
    After researching more, I went with a CSS menu that appears to compensate for the problem I was encountering. Apparently, there's more to it than hasLayout, specifically, setting "zoom," "white-space" and "height" for IE. I still don't completely understand it, but here's a link to the menu if anyone is interested.

    http://aplus.rs/adxmenu/

    It's a good looking CSS menu with a script for older browsers. Works great In Firfox and IE7.

    Still open to any hasLayout explanations.
    {{ DiscussionBoard.errors[61747].message }}

Trending Topics