2015-06-25 6 views
2

Я искал это за последние 30 минут, и я пробовал каждое решение, включая VH, устанавливая ширину HTML/Body до 100%, но по какой-то причине это просто не работает для меня.expand div на весь экран

При просмотре изображения: http://gyazo.com/a4df21fa35dda0805e344ba9d22b30be

Он не расширяется на весь экран по какой-то причине. Почему в нижней части экрана есть горизонтальный свиток?

<style> 
body { 
background: url('http://i.imgur.com/jzI8yai.jpg') no-repeat center fixed; 
    -webkit-background-size: cover; 
    -moz-background-size: cover; 
    -o-background-size: cover; 
    background-size: cover; 
    width: 100%; 
} 
html { 
width: 100%; 
} 
.bar { 

background: #003366; 
width: 100%; 
height: 50px; 
position: fixed; 
bottom: 0; 
margin: 0; 
overflow: hidden; 

} 


</style> 

<body> 
<div class="pictures"> 
</div> 

<div class="bar"> 

Hello 

</div> 



</body> 

ответ

2

Вам нужно добавить следующий стиль

html, body { 
    margin : 0; 
    padding : 0; 
} 
1

Вам нужно добавить margin:0 к элементу тела:

body{ 
    margin: 0; 
} 

В большинстве основных браузеров, маржа по умолчанию 8px со всех сторон , Он определяется в пикселях таблицей стилей пользователя-агента, предоставляемой вашим браузером.

Это одна из причин, почему люди используют Normalizr или , чтобы начать новый проект. Другой подход, чтобы избежать нежелательных результатов, может быть примерно таким:

* { 
    margin: 0; 
    padding: 0; 
    border: 0; 
} 
+1

Ух ты .. Я понятия не имел, что по умолчанию по умолчанию было 8 пикселей. Большое спасибо, я обязательно буду использовать остальные css для запуска нового проекта. – vbaid