Полосы прокрутки IE7, когда позиция: относительный элемент был вне экрана

Question

IE7, кажется, показывает полосы прокрутки, когда элемент, имеющий положение: относительно него ИСПОЛЬЗУЕТСЯ, чтобы вызвать полосу прокрутки (например, если бы вы отключили position: relative).

<div class="box">
    <div class="inner box"></div>
</div>

.box {
    position : absolute;
    top      : 5px;
    left     : 100px;
    right    : 5px;
    height   : 100px;
    border   : 1px solid #000;
}

.inner {
    right    : auto;
    position : relative;
    width    : 110%;
    left     : -90px;
}

Демо: http://jsfiddle.net/VE9ne/1/

Хотите знать, если кто-нибудь видел это и знает, как это исправить?

Answer 1

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

Вот что w3.org говорит об этом:

[...] Смещение поля (B1) в этом путь не влияет на коробку (B2), которая следует: В2 дается позиция, как будто В1 не были смещены, а В2 не переставлен после смещения B1 применяется. [...]

Источник: http://www.w3.org/TR/CSS21/visuren.html#relative-positioning

Использование полей и поплавков вместо относительного позиционирования может решить вашу проблему

Answer 2

Использовать отрицательные поля вместо отрицательных левых

...
left:0;
margin-left:-90px; 

Answer 3

Добавить

html, body
{
overflow: hidden;
}