Пространство между нижним колонтитулом и контентом

Question

Я пытаюсь убрать пробел между моим контентом и нижним колонтитулом. Все еще учусь использовать HTML, поэтому любая помощь будет оценена.

#foot {
  width: 1536px;
  clear: both;
  background-color: #800000;
  height: auto;
}

Answer 1

Эй, только что увидел ваш HTML, и я думаю, что теперь я понимаю вашу проблему. Вы хотите, чтобы у вашего Контента и Нижнего колонтитула вообще не было места, верно? Причиной получения пробела после добавления элемента H1 является то, что элемент H1 по умолчанию имеет свойство margin. Вы можете переопределить это, задав нулевое поле в CSS

h1 {
  margin:0px   
}

Проверьте эту скрипку, чтобы увидеть разницу. http://jsfiddle.net/6fuk2g8d/1/ Дайте мне знать, если это поможет.

Answer 2

Здравствуйте, я тоже все еще новичок в этом, но, возможно, это то, что вы имели в виду.

<div id="content">
  <h1>
  CONTENT
  </h1>
</div>
<footer>
  <h1>
  FOOTER
  </h1>
</footer>

#content {
  padding: 10px;
  background-color: red;
  height: 200px;
}
 footer {
    padding: 10px;
    transform: translateY(-21px);
    clear: both;
    background-color: black;
    color: white;
}

пожалуйста, проверьте этот jsfiddle http://jsfiddle.net/gyptzxev/

Вначале я вижу, что после помещения элемента h1 в нижний колонтитул делается пробел между содержимым div. поэтому в CSS я поставил transform: translateY(-21px); и пространство между ними исчезло. Тем не менее я знаю, что есть лучшие способы сделать это.