Поля тела: 0, ширина деления: 100% проблема в FF и Chrome, хорошо в IE - PullRequest
Новая
       11

Поля тела: 0, ширина деления: 100% проблема в FF и Chrome, хорошо в IE

0 голосов
/ 31 марта 2010

Я начинаю вырывать волосы из головы ...

У меня есть следующее: 

<html>
<head>
<style>
    body { margin:0 auto; }
</style>
</head>
<body>
    <div style="border: solid 1px red; width: 100%;">test</div>
</body>
</html>

Это работает в IE, создавая хороший div, ширину 100%, без полосы прокрутки H ...

Теперь в Chrome и FF оно на 1 пиксель шире, чем у окна, что вызывает полосу прокрутки H ...

Почему это? Что я должен использовать вместо этого?

Большое спасибо! Альберт

EDIT:

Я добавил div {margin: 0; } к голове и убрал ширину: 100% и все заработало, спасибо.

Ответы [ 5 ]

3 голосов
/ 31 марта 2010

border находится за пределами width, поэтому вы получаете 100% + 2px. Просто удалите свойство width - div по умолчанию имеет ширину 100%.

1 голос
/ 31 марта 2010

Как уже отметил мусорщик. Проблема заключается в проблеме. Сбросить все с помощью этой команды: 

<style>
  * { margin:0; }
</style>

Для получения дополнительной информации я рекомендую прочитать эту статью Эрика Мейера о сбросе CSS во всех браузерах к одинаковым значениям по умолчанию.

0 голосов
/ 31 марта 2010

У меня все еще были проблемы с этим, в конце я добавил стиль = "zoom: 1;" в дивы 

<div style="zoom: 1;">
    <div style="zoom: 1;">
        <table style="width: 100%"...
        ...
        </table>
    </div>
</div>

DIV с переполнением: авто и таблица шириной 100%

0 голосов
/ 31 марта 2010

заменить width:100% на margin:0px

0 голосов
/ 31 марта 2010

Вы забыли отключить поле div.

...