Нежелательная перенос слов в некоторых браузерах - почему это отображается по-другому? - PullRequest
Новая
       18

Нежелательная перенос слов в некоторых браузерах - почему это отображается по-другому?

0 голосов
/ 18 августа 2010

У меня проблемы с меню сайта, который я разрабатываю. Вот как выглядят меню в разных браузерах.

Хром 5

Chrome

Опера 10

Opera

Firefox 4 Beta 2

Firefox

Internet Explorer 8

Internet Explorer

Меню выглядит хорошо в Chrome, но в некоторых браузерах маленькая стрелка переносится на следующую строку. Кроме того, в Firefox и IE пункт меню перекрывается со стрелкой. Как мне это исправить?

Здесь вы можете найти таблицу стилей, источники HTML и все такое прочее: http://labs.pieterdedecker.be/vspwpg/

Ответы [ 3 ]

1 голос
/ 18 августа 2010

в файле style.css добавить width:100% в ul#menu > li > ul li

0 голосов
/ 18 августа 2010

хммм, что если вы измените интервал для маленьких стрелок ">>" на это 

ul#menu > li > ul > li a > span.sf-sub-indicator {
margin-left:5px;
position:absolute;
right:5px;
}

и добавите больше отступов вправо к li 

ul#menu > li > ul li {
...
padding-right:20px;
...
}

, это работаетв FF, но я не уверен в других

0 голосов
/ 18 августа 2010

Это из-за float: прямо в промежутке за пунктом меню с двойной стрелкой в ​​нем (класс sf-sub-Indicator). Плавающее это позволит содержимому перекрываться, как они делают сейчас, потому что это убирает элемент из потока.

Теорию, лежащую в основе плавающих элементов, вы найдете здесь: http://www.smashingmagazine.com/2007/05/01/css-float-theory-things-you-should-know/

...