Откуда эта граница ниже моего нижнего колонтитула?

Question

В большинстве браузеров у меня есть поле ниже нижнего колонтитула. Хотя не в Chrome. См. введите описание ссылки здесь

И body, и моя обертка страницы имеют margin: 0. Обертка тоже height: 100%.

Вот код нижнего колонтитула:

#colophon { clear: both; display: table; width: 960px; max-width: 960px; background: #131313; border-top: 3px solid #0099cc; border-collapse: collapse; }

Добавление margin: 0 там не помогает. В любом случае не должно быть необходимости. Чего мне не хватает?

Answer 1

В нижней части вашего кода я нашел это

<img alt="" src="http://stats.wordpress.com/g.gif?host=atlanticsentinel.com&amp;rand=0.059020346471435614&amp;blog=28342037&amp;v=ext&amp;post=0&amp;ref=" id="wpstats">

Если вы удалите это работает. Что вам нужно сделать, это добавить display: none к этому изображению в CSS. Я видел, что вы добавили visibility: hidden. Когда вы делаете это, оно скрывает изображение, но оно все равно занимает место в DOM.

Answer 2

Ваше изображение трекера wordpress stats установлено на visibility: hidden и соответствует вашему тегу тела. Именно это изображение создает дополнительный интервал нижнего колонтитула, как вы можете видеть, изменив изображение следующим образом: img#wpstats { display: none; } (не оставляйте это так - см. Ниже)

Я бы переместил это изображение в ваш главный нижний колонтитул (т.е. #colophon) куда-нибудь, чтобы это не вызвало проблем. Кроме того, вы можете установить его на position: absolute, чтобы полностью удалить его из потока. Вы не можете установить его как display: none, так как браузер должен загрузить изображение, чтобы ваше отслеживание работало.

Answer 3

проблема вызвана вашим последним изображением img#wpstats, потому что его свойство видимости скрыто

если вы установите display: none для этого изображения (или сделаете его абсолютно позиционированным, настраивая отрицательные верхние или левые свойства), вы решите проблему