Блог

Я планировал создать полноэкранные разделы для страницы, и все это работало хорошо, пока не решило не работать. Я не уверен, что с этим не так, но если кто-нибудь может сказать мне, я был бы благодарен.

Divs:

 <div class="container1">
    <a href="#cont1">
        <img src="down.png"></img>
    </a>
    <h1>Day</h1>
    <p>
        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris gravida ultricies suscipit. Integer in luctus enim, id varius velit. Suspendisse potenti. Quisque feugiat lectus eget est suscipit, eget aliquam mauris pharetra. Fusce aliquet dui nec mi
        pulvinar, eu volutpat diam volutpat. Integer eget neque facilisis, ornare felis ac, vulputate eros. Etiam et accumsan erat. Aenean porttitor egestas justo et vestibulum. Donec gravida dignissim neque id vehicula. Ut non nunc ut lectus placerat tempor.
        Sed porttitor ullamcorper eros, sed eleifend felis. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Quisque mauris erat, consequat sed nulla et, volutpat accumsan leo. Mauris cursus aliquet magna, eu facilisis
        velit scelerisque vitae. Aliquam tristique id nisl in pulvinar. Vestibulum non adipiscing dui, a commodo lorem.
    </p>
</div>
<div class="container2">
    <a href="#cont">
        <img src="up.png"></img>
    </a>
    <h2>Night</h2>
    <p name=cont1>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris gravida ultricies suscipit. Integer in luctus enim, id varius velit. Suspendisse potenti. Quisque feugiat lectus eget est suscipit, eget aliquam mauris pharetra. Fusce aliquet dui nec mi
        pulvinar, eu volutpat diam volutpat. Integer eget neque facilisis, ornare felis ac, vulputate eros. Etiam et accumsan erat. Aenean porttitor egestas justo et vestibulum. Donec gravida dignissim neque id vehicula. Ut non nunc ut lectus placerat tempor.
        Sed porttitor ullamcorper eros, sed eleifend felis. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Quisque mauris erat, consequat sed nulla et, volutpat accumsan leo. Mauris cursus aliquet magna, eu facilisis
        velit scelerisque vitae. Aliquam tristique id nisl in pulvinar. Vestibulum non adipiscing dui, a commodo lorem.
    </p>

</div>
  

Css:

 body {
background-image: url('http://media-cache-ec0.pinimg.com/736x/b8/02/64/b80264c12c88eac19d5e4c8597d051e1.jpg');
background-attachment: fixed;
background-size: cover;
font-family: 'Roboto', sans-serif;
text-align: center;
color: white;
height: 100%;
text-shadow: black 0 0 4px;
}
p {
    height: 100%;
}
.container1 {
    position: absolute;
    height: 100%;
}
.container2 {
    width: 100%;
    background-image: url(http://ak7.picdn.net/shutterstock/videos/5200997/preview/stock-footage-blurred-background-of-moving-lights-from-a-road-of-traffic-at-night-time.jpg);
    background-attachment: fixed;
    background-size: cover;
    margin: 0;
    position: absolute;
    left: 0;
    height: 100%;
}
img {
    max-width: 15vw;
    height: auto;
}
.container1 img {
    position: absolute;
    top: 0;
    left: 0;
}
.container2 img{
    position: absolute;
    left: 0;
}
h1 {
    font-size: 15vw;
}
h2{
    font-size: 15vw;
}
  

Пожалуйста, игнорируйте любые проблемы совместимости или неправильное использование определенных тегов, я работаю над этим.

Сломанный результат:

Я хочу, чтобы дневная часть была на полную высоту

Не только body , но html и тег должен быть установлен на height: 100% . Свойство Percentage height вычисляется относительно родительского элемента и, как выясняется, body не является самым высоким, html является.