Firefox показывает текст больше, чем другие

0

У меня есть панель меню из элементов li, каждая из которых плавает влево, чтобы иметь их бок о бок. Это работает на большинстве brwsers, но не на моем клиентском firefox (mac version 26), ли немного больше, делая их переполнением в конце строки (вероятно, 10px)

Любая идея почему? У меня сброс css, а margin и padding установлены в значение.

это html:

<ul id="menu">
                <li class="menuItem"><a class="menuItemLink" href="interface.php?type=architecture&amp;page=projets-realisations">projets-realisations</a>
                    <ul class="subMenu">
                        <li class="subMenuItem"><a class="subMenuItemLink" href="interface.php?type=architecture&amp;page=projets-realisations-en-resume">En résumé</a></li>
                        <li class="subMenuItem"><a class="subMenuItemLink" href="interface.php?type=architecture&amp;page=projets-realisations-az">De A à Z</a></li>
                    </ul>
                </li>
                <li class="menuItem"><a class="menuItemLink" href="interface.php?type=architecture&amp;page=portes-parquets-escaliers">Portes-parquets-escaliers</a> </li>
                <li class="menuItem"><a class="menuItemLink" href="interface.php?type=architecture&amp;page=cuisines-salles-de-bain">cuisines-salles de bain</a> </li>
                <li class="menuItem"><a class="menuItemLink" href="interface.php?type=architecture&amp;page=decoration-tentures">decoration-tentures</a> </li>
                <li class="menuItem"><a class="menuItemLink" href="interface.php?type=architecture&amp;page=de-ville-en-ville">de ville en ville</a> </li>
                <li class="menuItem"><a class="menuItemLink" href="interface.php?type=architecture&amp;page=espace-animalier">espace animalier</a> </li>
            </ul>

CSS:

.menuItem {float:left; cursor: default; position: relative; margin-left:4px; padding:0px; margin-right:0px;}
.menuItem:last-child {margin-right:-50px;}
.menuItemLink {line-height: 20px; color: #ffffff; text-transform: uppercase; font-size: 13px; padding-left:5px; padding-right: 5px; text-decoration: none;}

Край-право -50 просто для того, чтобы убедиться, что последние элементы не идут по новой строке... Почему он просчитан его firefox? Самое странное, что я попробовал одну и ту же версию firefox на mac (другое osversion) и не имею этой проблемы.

  • 0
    Вы не установили размер шрифта .menuItem, попробуйте установить для него какое-либо значение
  • 0
    Вам нужен тип стиля списка, то есть круг вокруг li? если нет, вы можете просто установить отображение: inline-block ваш menuItem
Показать ещё 1 комментарий
Теги:
firefox

2 ответа

0
Лучший ответ

Пробовал все ваши предложения, но не работал, ведь заменил все прокладки комбинированными полями, теперь все в порядке

1

Вам нужно увеличить правое поле для функции menuItem

margin-right: 15px;

Вы можете проверить http://jsfiddle.net/raunakkathuria/vRns2/

Если вам не нужен стиль списка, добавьте в.menu

list-style-type: none;

и display: inline-block to.menuItem, тогда вам не нужно играть с разницей

Ещё вопросы

Сообщество Overcoder
Наверх
Меню