如何引導，使剛模態滾動＆不是別人？

Question

我創建像引導一個模式&一切正常。我注意到的唯一的事情就是引導防止身體標記的溢出時模式打開，但語氣有此屬性溢出，如果在模態的含量超過屏幕的高度...，怎麼說？我加了overflow：hidden;當模式打開時爲身體&溢出：auto;模態，但它不工作...

Answer 1

基本上，一旦你把一個HTML元素進行元素的正常流動，它的父元素不應該影響元素本身。

因此，身體有一個overflow: hidden;，但由於覆蓋物位於流的外部，overflow不會影響它。

由於.overlay具有overflow-y: auto，所以應該爲該元素的內容專門顯示滾動。

因此，一旦一個元素被定位position: absolute或position: fixed，它不應該被它影響的前身的overflow

body { 
 
    overflow: hidden; 
 
} 
 

 
.overlay { 
 
    position: absolute; 
 
    top: 0; 
 
    right: 0; 
 
    bottom: 0; 
 
    left: 0; 
 
    overflow-y: auto; 
 
    padding: 30px; 
 
    background: rgba(0, 0, 0, 0.5); 
 
} 
 

 
.modal { 
 
    margin: auto; 
 
    width: 400px; 
 
    height: 1000px; 
 
    background: white; 
 
    border-radius: 5px; 
 
    padding: 10px; 
 
}

<div class="overlay"> 
 
    <div class="modal">I'm a long modal</div> 
 
</div> 
 

 

 
Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll.Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll.Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll.Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll.Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll.Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll.Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll.Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll. Everything here should not scroll.

這裏有一個外部​​

Answer 2

答案是增加overflow到您的模式的內容區域。如果你看一下引導的結構，它是沿着線：

<modal> 
    <modal-header></modal-header> 
    <modal-contents> 
    Your content here 
    </modal-contents> 
    <modal-footer></modal-footer> 
</modal> 

本身所具有的最大高度的模式，和子元素（標題，內容，頁腳）都具有固定的高度，與具有內容區域溢出。

怪異適當的可能是這對CSS-技巧最近的一篇文章：

https://css-tricks.com/considerations-styling-modal/