Макет сбрасывается при увеличении

Question

Я сделал фиксированный макет, и он отлично работает на всех браузерах. Но при увеличении, по крайней мере, одной прокрутки колеса (90%), элементы второй навигации (# header-navigation) разбиваются на большее количество строк и выталкивают элементы из своих мест. Я попытался установить размер шрифта, отступы и маржу, используя em и%, но ничего хорошего. Если я делаю переполнение: скрытый для # header-navigation, я могу уменьшить масштаб до 50% без проблем. Это вполне достаточно для меня, но скрыть это не вариант.

Вы можете увидеть здесь: http://palivonas.lt/test/stackoverflow/

EDIT: Понял работает на Chrome и IE9 (благодаря @GGG), но Firefox по-прежнему толкает #social окно вниз, даже если линия не ломается в навигации больше ,

Answer 1

Вот исправление.

Изменить список объектов 'display property to inline-block, и удалить float.

#header-navigation li { 

    background: url(images/slash_header.png) right no-repeat; 
    padding-right: 26px; 
    margin-right: 19px; 
    display: inline-block; 

} 

Добавить white-space: nowrap в список заказанных с навигацией.

ol, ul { 

    list-style: none; 
    white-space: nowrap; 

}