Абсолютное и относительное позиционирование для контейнера

#container { 

      background-color: grey; 
      top: 40px; 
      left: 50px; 
      width: 500px; 
      height: 400px; 
      position: absolute; 
      border: 2px solid black; 
      }

У меня есть один тег div в теле с этим id. Ничего больше. Допустим, что верхняя левая вершина этого контейнера отображается в браузере в точке x, y. Теперь, когда я изменяю свойство position на относительное, по иронии судьбы он отображается в месте ~ (x + 10, y + 10). Почему это происходит?Абсолютное и относительное позиционирование для контейнера

источник

2013-12-03 The-Droidster

Вы случайно удалили поле по умолчанию из body? Вероятно, маржа по умолчанию применяется большинством браузеров.

Попробуйте добавить это:

body { margin: 0; padding: 0; }

Fiddle: http://jsfiddle.net/5TZBf/

источник

2013-12-03 22:46:47 sbeliv01

Да! Это решает! Мне просто интересно, что могло бы вызвать это. Я никоим образом не изменил тег тела. Но спасибо в любом случае, просто хотел подтвердить, что должно быть по умолчанию. –

Большинство, если не все, браузеров имеют таблицу стилей по умолчанию, в которой «тело» обычно имеет край 10, применяемый со всех сторон, что объясняет вашу проблему. Вы должны явно переопределить эти значения по умолчанию, добавив определение в таблицу стилей, как было предложено; широко известный как Сброс CSS (из которого в Интернете доступно много свободного места). – sbeliv01

Это из-за краев по умолчанию на странице простой сброс может быть сделано. Fiddle

*{ 
    padding:0; 
    margin: 0; 
}

источник

2013-12-03 22:48:00 Last1Here

Абсолютное и относительное позиционирование для контейнера

ответ

Смежные вопросы