title: Layout messes up when zoomed out
body: <p>I've made a fixed layout and it works great on all browsers. But when zoomed out at least one wheel scroll (90%) the second navigation (#header-navigation) items break into more lines and that pushes elements below out of their places. I tried setting font-size, padding and margin using em and %, but no good. If I make overflow: hidden for #header-navigation, I can zoom out up to 50% with no problems. That's totally enough for me, but hiding is not an option, however.</p>
  
  <p>You can see it here: <a href="http://palivonas.lt/test/stackoverflow/" rel="nofollow">http://palivonas.lt/test/stackoverflow/</a></p>
  
  <p>EDIT: Got it working on Chrome and IE9 (thanks @GGG), but Firefox still pushes #social box down, even though line doesn't break in navigation any more.</p>