Огромное заполнение баннера

Question

Я добавил баннер на веб-страницу www.torontopoet.com/etsystories, а теперь под баннером находится огромный кусок пробела перед началом содержимого. Это код, который я использовал для баннера:

<div id="banner"> 
</div> 
<style> 
html,body 
{ height:100%; 
width:100%; 
} 
#banner { 
background:url('.png'); 
width:100%; 
height:100%; 
background-size:100%; 
background-repeat: no-repeat; 
margin-left: auto; 
margin-right: auto; 
} 
</style> 

Answer 1

Не видя ваш HTML тоже, я действительно ничего не могу сказать, но ...

#banner { 
background:url('.png'); 
width:100%; 
height:100%; <!--- ? ---> 
background-size:100%; 
background-repeat: no-repeat; 
margin-left: auto; 
margin-right: auto; 
} 

Вы уверены, что хотите, знамя быть на 100% от высоты его контейнера?

Answer 2

html,body 
{ 
height:100%; 
width:100%; 
} 
#banner 
{ 
background:url('http://cdn2.hubspot.net/hubfs/418991/realview.jpg'); 
width:400px; 
height:251px; 
display:block; 
background-size:cover; 
background-repeat: no-repeat; 
margin:0 auto; 
}