私はウェブページを作ったが、下部に余分な空白があるが、これをどうやって取り除くのか？

Question

screen shot of webpage with excess white space at the bottom

私はこのウェブページを作成しましたが、そこに余分な余白があり、私はどのように取り除くのか分かりません。私は、CSSファイル内の本体またはメインセクションの幅と高さと関係があるように感じますが、わかりません。私のCSSファイルのコードは次のとおりです。

body { 
background: url('black_gradient.png')repeat-x; 
text-align: center; 
height: 800px; 
} 
#main{ 
width: 1000px; 
height: 1000px; 
background: url('brown gradient.jpg')repeat-x; 
margin: 25px auto; 
border: solid 2px #ff3819; 
border-bottom: solid 0px; 
padding: 10px; 
} 
h1{ 
    text-align: center; 
    font-family:"Times New Roman"; 
    font: 24pt; 
    color: #000000; 
} 
hr { 
    height: 2px; 
    color: #000000; 
} 
p { 
    font-family:"Calibri"; 
    font-size: 12pt; 
    text-align: left; 
    text-indent: 48px; 
    color: #000000; 
} 

Answer 1

あなたの体と#mainからの高さを削除するか、自動

Answer 2

試しにそれらを設定します。私もCSSのグラデーションについて読んでお勧めします

background-size: cover; 

。