Белая область внизу домашней страницы после удаления фонового изображения

Question

У меня есть простая проблема, которая, скорее всего, будет иметь простое решение. Я проверил другие темы, но никто, кажется, не исправил проблему, которую я имею.

Моя проблема: Пробел в нижней части моей домашней страницы.

Моя цель состоит в том, чтобы страница с сплошным черным фоном и навигационной панелью наверху, где черный фон покрывает всю страницу и не имеет полосы прокрутки. В настоящее время мне трудно получить элемент body, чтобы покрыть высоту страницы черным цветом, так что вместо этого я вижу большое пустое пространство под содержимым моей страницы.

Я пробовал испортить поля и отступы, но я думаю, что могу делать это не в том месте.

Мой сайт: www.hallofheroclix.com (цвета будет все черное на финише)

Любая помощь очень ценится. Заранее большое спасибо!

Answer 1

Вы не присвоили цвет фона телу.

Пожалуйста, добавить фоновую CSS свойство тела:

body { 
    color: #141412; 
    line-height: 1.5; 
    margin: 0; 
    background: #000000; 
}

Благодарности

Answer 2

**Try this instead** 

I have looked you coding, i have made some changes to html structure and added some css.You can add/update this css to your css file style.css. 

**Css** 
<style> 
    .navbar { 
     text-align: center; 
     background-color: rgb(255, 242, 0); 
     position: static !important; 
     top: -230px; 
    } 
    html, body { 
     height: 100% !important; 
    } 
    .main-container { 
     background-color: red; 
     height: 301px; 
    } 
    #page { 
     height: auto; 
     min-height: 100%; 
     background-color: #000; 
    } 
</style> 

**Html** 
     <header id="masthead" class="site-header" role="banner"> 
      <div id="navbar" class="navbar"> 
       <nav id="site-navigation" class="navigation main-navigation" role="navigation"> 
        <button class="menu-toggle">Menu</button> 
        <a class="screen-reader-text skip-link" href="#content" title="Skip to content">Skip to content</a> 
        <div class="nav-menu"><ul><li class="page_item page-item-6"><a href="">BP</a></li><li class="page_item page-item-20 current_page_item"><a href="">Home</a></li><li class="page_item page-item-24"><a href="">Test Subject</a></li></ul></div> 
        <form role="search" method="get" class="search-form" action=""> 
       <label> 
        <span class="screen-reader-text">Search for:</span> 
        <input type="search" class="search-field" placeholder="Search &hellip;" value="" name="s" title="Search for:" /> 
       </label> 
       <input type="submit" class="search-submit" value="Search" /> 
      </form>     
       </nav><!-- #site-navigation --> 
      </div><!-- #navbar --> 
      </header><!-- #masthead --> 
      <div class="main-container"> 
      <a class="home-link" href="# title="My Site" rel="home"> 
       <h1 class="site-title">My Site</h1> 
       <h2 class="site-description">Cool logo coming soon!</h2> 
      </a> 
      </div> 
       <div id="main" class="site-main">