2016-12-08 3 views
0

Я использую следующий код для того, чтобы просмотреть среднюю часть и держать верхнюю часть до сих пор видны:Фиксированная позиция и прокрутка

<body style="overflow:auto"> 
    <div class="table-layout" style="position:fixed;z-index:10000"> 
     <div class="table-cell fixed-width-200" main-screen-title> 
     </div> 
     <div class="table-cell fixed-width-200"> 
     </div> 
     <div style="height:50px;border-bottom:solid;border-width:1px;width:90%;"> 
     </div> 
    </div> 
    <div ui-view style="margin-top:50px;width:99%;height:94%;top:50px;z-index:-1"></div> 
</body> 

CSS

<style> 
.table-layout { 
    display: table; 
    width: 100%; 
} 

    .table-layout .table-cell { 
     display: table-cell; 
     vertical-align:middle; 
    } 

.fixed-width-200 { 
    width: 200px; 
} 

Когда я загружаю содержание в ui-view все выглядит правильно. После изменения размера браузера и прокрутки вниз содержимое будет покрывать область над ним, пока я хочу иллюзию, что она уходит. Любая идея, что не так с моим кодом?

Thanks

ответ

2

Ваш самый верхний div прозрачный. Дайте ему цвет, добавив

background-color: #fff; 

к классу .table верстки и прокрутка часть появится под ним.

+0

Да, это было пропущено, спасибо! – Mark

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