Итак, у меня есть элемент, который помещается непосредственно внутри тела:
<body>
<div id="header">Some stuff...</div>
Other stuff...
</body>
Ниже используется CSS:
body{
text-align:center;
}
#header{
margin:auto;
}
Таким образом, div #header устанавливается на 100% ширину (по умолчанию) и центрируется. Проблема в том, что существует "пробел" между границей окна и элементом #header... Например:
| |----header----| |
^window border ^window border
Я попытался настроить его с помощью javascript, и он успешно изменяет размер элемента до точной ширины окна, но он не устраняет "пробел":
$('#header').width($(window).width());
Одним из решений является добавление следующих правил CSS (и сохранение javascript выше):
#header{
margin:auto;
position:relative;
top:-8px;
left:-8px;
}
В моем браузере это "пространство" - 8 пикселей, но я не уверен, что это одно и то же во всех браузерах? Я использую Firefox на Ubuntu...
Итак, какой правильный способ избавиться от этого пространства - и если это то, что я использовал выше, делают ли все браузеры одинаковыми?