Относительно положение div в фиксированном div?

У меня есть этот фиксированный градиент div, который должен содержать весь мой контент, чтобы этот элемент позиции курсора продолжал работать. Проблема в том, что я хочу, чтобы контент прокручивался и не фиксировался. Как я могу это достичь?Относительно положение div в фиксированном div?

Вот что у меня есть:

<body> 

     <div class="wrapper"> 
      <div class="gradient"> 
      <div class="logo"> 
       <img src="logo-05.svg"> 
      </div> 

      <div class="statement"> 
       This is a blockquote. Someone said something really funny and it should be noted here. Aenean massa strong . Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim. Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In em enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo. Nullam link dictum felis eu pede mollis pretium. This is a blockquote. Someone said something really funny and it should be noted here. Aenean massa strong . Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim. Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In em enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo. Nullam link dictum felis eu pede mollis pretium. 
      </div> 
      </div> 
     </div> 


    .gradient { 
     height: calc(100%); 
     background: -webkit-linear-gradient(270deg, #FFCC33,#FF3366); 
     background: -moz-linear-gradient(270deg, #FFCC33,#FF3366); 
     background: -o-linear-gradient(270deg, #FFCC33,#FF3366); 
     background: -ms-linear-gradient(270deg, #FFCC33,#FF3366); 
     background: linear-gradient(180deg, #FFCC33,#FF3366); 
     position: fixed; 
     width: 100%; 
     background-color: #292c2f; 
     font-family: monospace; 
     overflow: hidden; 
     font-size: 100pt; 
     color: white; 
     z-index: -99; 
    } 

.wrapper{ 
    width: 100%; 
    height:100%; 
    position: relative; 
} 

.header{ 
    width: 100%; 
    position: fixed; 
} 

.dates{ 
    color:black; 
    z-index: 99; 
    display: inline-block; 
    float: left; 
    padding-top: 5px; 
    font-size: 20pt; 
    margin-left: -20px; 
    font-family: 'Roboto', sans-serif; 
    font-weight: 400; 
    letter-spacing: 1pt; 
} 


.year{ 
    color:black; 
    margin-top: -10px; 
    z-index: 99; 
display: inline-block; 
    top:25px; 
    font-size: 55pt; 
    margin-left: 20px; 
    font-family: 'Kavoon', sans-serif; 
    font-weight: 800; 
    letter-spacing:-3px; 
} 

.location{ 
right: 35px; 
top: 35px; 
text-align: right; 
width: 100%; 
position: fixed; 
font-size: 20pt; 
font-family: 'Roboto', sans-serif; 
font-weight: 400; 
color: black; 
} 

.logo{ 
    margin-right: auto; 
    margin-left: auto; 
    width: 600px; 
    position: relative; 
} 

.statement{ 
    position: relative; 
    font-size: 14pt; 
    color:black; 
    width:500px; 
    margin-right: auto; 
    margin-left: auto; 
    font-family: 'Roboto', sans-serif; 
} 

.footer ul { 
    text-align: center; 
    font-size: 14pt; 
    font-family: 'Roboto', sans-serif; 
    font-weight: 800; 
    width:100%; 
    display:inline-block; 
    text-transform: uppercase; 

} 
.footer-wrap{ 
    color:black; 
    width: 100%; 
    text-align: center; 
    margin-bottom: 45px; 
    bottom: 0; 
    position: fixed; 
    padding:10; 

    display: inline-block; 
}

источник

2016-04-28 K80

Просто измените свойство overflow:hidden; к overflow: scroll; в вашем .gradient классе.

JSFiddle.

источник

2016-04-28 23:12:19

Относительно положение div в фиксированном div?

ответ

Смежные вопросы