Как расширить границы до нижней части страницы?

Я предлагаю вам установить главный div в высоту окна и установить свойство height на 100% для вашего содержимого div следующим образом:

#main {
  width: 93%;
  margin: -2% auto 0% auto;
  position: absolute;
  top: 0;
  bottom: 0;
}
#content {
  border: solid white;
  margin: 0% -4% 1000% -4%;
  height: 100%;
}

Теперь граница будет простираться до нижней части страницы!

Вы устанавливаете ширину 93%, а затем вы переопределяете это с помощью вашей -4% вещи - так что просто не делайте первую часть. body есть запас чего-то по умолчанию: так избавитесь от этого:

Поместите границу на свой html и тело, например - красный. и посмотрите, что на самом деле происходит. Тело только растягивается, чтобы соответствовать вашему контенту... так что вам нужно сказать, насколько он может быть... (100%), тогда вы должны рассказать о том, что делать и т.д. Это не полный /perfect answer --- но он должен приблизить вас к вашей цели.

html, body {
    height: 100%; /* remind these guys they can be as tall as the viewport if they want */
}

body{
    margin: 0; /* remove default margin */
    color: white;
    background-color: black; /* white on white is no helpful */
}

#main{
    height: 100%;
}

#content{
    border: solid white; /* you need a px value */
    min-height: 100%;
}

a {
  color:white; /* you don't need to specify for every state */
}