Нижний колонтитул отделен от другого содержимого

Question

Так что я не установил поля на секции перед нижним колонтитулом, но каким-то образом он отделен, и я не могу понять почему. Есть идеи? благодаря!

HTML:

<section> 
<div class="content"></div> 
</section> 

<footer> 
<div id="footer"></div> 
</footer> 

и CSS:

.content{ 
background-image: linear-gradient(bottom, rgb(135,127,127) 0%, rgb(37,37,35) 69%); 
background-image: -o-linear-gradient(bottom, rgb(135,127,127) 0%, rgb(37,37,35) 69%); 
background-image: -moz-linear-gradient(bottom, rgb(135,127,127) 0%, rgb(37,37,35)  69%); 
background-image: -webkit-linear-gradient(bottom, rgb(135,127,127) 0%, rgb(37,37,35) 69%); 
background-image: -ms-linear-gradient(bottom, rgb(135,127,127) 0%, rgb(37,37,35) 69%); 

background-image: -webkit-gradient(
linear, 
left bottom, 
left top, 
color-stop(0, rgb(135,127,127)), 
color-stop(0.69, rgb(37,37,35)) 

);

#footer{ 
    background:url(images/footer.png) left top no-repeat; 
    height:450px; 
    } 

Answer 1

попробуйте применить CSS Reset, прежде чем делать какие-либо из вашего стиля: http://meyerweb.com/eric/tools/css/reset/

Answer 2

В HTML4 спецификации (http://www.w3.org/TR/CSS21/sample.html) есть по умолчанию таблицы стилей определяющих полей и другое форматирование. Это может привести к тому, что браузер отобразит маржу, даже если вы не указали ее в своем CSS.

Насколько я знаю, спецификаций для таблицы стилей по умолчанию в HTML5 пока нет, поэтому браузеры используют свои собственные таблицы стилей по умолчанию.

Поэтому кажется, что маржа, используемая элементом section, имеет определенный запас по умолчанию (в браузере). Лучший способ избежать этого - сбросить CSS.

http://html5doctor.com/html-5-reset-stylesheet/, вероятно, является хорошим решением для вас.