2014-09-18 2 views
0

Итак, я пытаюсь сделать сайт, используя только проценты, однако на основном содержании я использую margin-top: 10%, но он делает интервал на снизу и создает полосу прокрутки.Масштабирование жидкости - пространство в нижней части при использовании маржинального процента

http://i.imgur.com/ZJl8Zp0.png
Если вы посмотрите на изображение, вы заметите, что даже если основное содержание не расширяется ниже страницы, однако он по-прежнему создает пространство снизу (смотреть на полосе прокрутки).

<!DOCTYPE html> 
<html> 
    <head> 
     <meta charset="UTF-8"> 
     <title></title> 
     <link rel="stylesheet" href="style.css"> 
    </head> 
    <body> 
     <div class="main"></div> 
    </body> 
</html> 


* { 
    margin: 0; 
    padding: 0; 
} 

html { 
    height: 100%; 
    width: 100%; 
} 

body { 
    height: 100%; 
    width: 100%; 
    background: pink; 
    position: relative; 
} 

.main { 
    margin-top:10%; 
    height: 600px; 
    width: 960px; 
    background: blue; 
} 

ответ

1

Просто удалите height: 100% стиль, который вы назначили на body внутри вашего CSS. Вот как это должно быть:

body { 
    height: auto; 
    width: 100%; 
    background: pink; 
    position: relative; 
}