Как исправить мое HTML-меню (простое меню неправильно работает в браузерах WebKit)

Я задаю этот вопрос здесь, потому что я немного отчаянно пытаюсь решить эту проблему, которая сейчас меня действительно озадачила, поскольку я не вижу для этого причины.

Вы можете увидеть верхнюю навигацию с надписью «Домой, играть в гольф... и т. д.» в верхней части этой страницы: http://urbangolf.mammalworld.com/golf-club-fitting/half-day

Кажется, он работает правильно (выстраивается в одну строку) в Firefox и IE, но в Chrome и Safari он переходит на вторую строку с размером около 710 пикселей, и я не могу найти причину. Кажется, это связано с заменой шрифта с помощью Cufon, но это должно произойти, но если два других браузера (особенно IE !!) могут правильно отображать его, как я могу заставить вебкит вести себя?

Ваша помощь будет принята с благодарностью.

Верно [IE/FF]

замещающий текст http://urbangolf.mammalworld.com/templates/navigation-correct.jpg< /а>

Неправильно [Chrome/Safari]

замещающий текст http://urbangolf.mammalworld.com/templates/navigation-wrong.jpg< /а>


person Shadi Almosri    schedule 07.02.2010    source источник


Ответы (1)


Я не совсем уверен, почему webkit решил это сделать, но, к счастью, для таких ситуаций есть простое решение с использованием горизонтальных шаблонов <ul>.

В user.css Изменить:

.top-navigation ul {margin:0;padding:0;padding-top:10px;padding-bottom:10px;width: 960px;}

Добавьте white-space: nowrap;:

.top-navigation ul {margin:0;padding:0;padding-top:10px;padding-bottom:10px;width:960px;white-space:nowrap;}
person Nick Craver    schedule 07.02.2010