прокладка даже не в IE - PullRequest
Новая
       12

прокладка даже не в IE

0 голосов
/ 24 июня 2009

Если вы вставляете следующий код в test.html и просматриваете с помощью firefox, это нормально. Но если вы просматриваете с помощью IE, вы можете видеть, что справа от элемента <a> больше места .:

<style>
li { 
    display:inline;
    margin:0 90px;
    padding:6px 12px;
    background:#777777 none repeat scroll 0 0;
}



li a {
    color:#FFFFFF;
    text-decoration:none;
    font-weight:bold;
}
</style>


<div id="tabs">
    <div class="nav">
        <ul>
            <li><a href="test">test</a></li>
            <li><a href="test">test</a></li>
            <li><a href="test">test</a></li>
            <li><a href="test">test</a></li>
            <li><a href="test">test</a></li>
        </ul>
    </div>
</div>

РЕДАКТИРОВАТЬ : Как сделать текст даже в IE?

Ответы [ 4 ]

0 голосов
/ 25 июня 2009

Чтобы ответить на ваш вопрос, просто: поместите все свои элементы li в одну строку или поплавки.

0 голосов
/ 25 июня 2009

Проблема заключается в том, что браузеры не согласны с тем, где блочная модель CSS решает, что делать с отступом:

  • IE уменьшает пространство для содержимого внутри div, когда вы увеличиваете заполнение, поэтому размер div остается неизменным
  • Firefox увеличивает размер div с отступом, сохраняя размер содержимого таким же.
0 голосов
/ 25 июня 2009

Протестировано в IE6, кажется, добавляет дополнительный пробел к тегам привязки. Скопируйте и вставьте его, и вы сами увидите. Firefox не добавляет дополнительного пространства.

Вы можете изменить маржу для IE, если хотите. Это не идеальное решение, но оно может помочь вам сделать вкладки похожими. Если вам нужно, чтобы он был одинаковым во всех браузерах, вы всегда можете использовать изображение. Но попробуйте это: 

li a {
color:#FFFFFF;
text-decoration:none;
font-weight:bold;
}

*html li a {
color:#FFFFFF;
text-decoration:none;
font-weight:bold;
margin-right:-3px;
}

*+html li a {
color:#FFFFFF;
text-decoration:none;
font-weight:bold;
margin-right:-3px;
}
0 голосов
/ 25 июня 2009

Я посмотрел на ваш источник и попробовал сам.

В Firefox 3.0.11 и Internet Explorer 8 я показывал почти одинаковые страницы.

Единственное, что я могу сказать, это то, что изначально страницы выглядели по-разному, потому что мои браузеры имели разную ширину, а не проблему с полями, которую вы имели. В моем случае изменение размера браузера работает.

Но проблема у вас общая. Internet Explorer почти всегда будет отображать страницы, отличные от того, который обычно соответствует стандартам браузера. Один из способов обойти это (и это вполне может решить вашу проблему) - использовать лист сброса CSS.

Вот некоторые хорошие:

...