如何讓我的模態背景進入頁面的底部而不是視口的底部？

Question

我需要爲這個組合網站上的圖片製作一個燈箱。我將所有東西都連接起來，以便圖像在被點擊時變成原始大小，就像一個簡單的燈箱一樣。但是我遇到的問題是，模式背後的背景只能下到視口的底部，而不是一直走到頁面的底部。讓我知道，如果我可以提供任何額外的信息。

Lightbox Problem

#overlay { 
background: rgba(0,0,0,0.8); 
width: 100%; 
height: 100%; 
position: absolute; 
top: 0; 
left: 0; 
display: none; 
text-align: center; 
} 

#overlay img { 
    border-radius: 4px solid white; 
    margin-top: 10%; 
} 

#overlay p { 
    color: white; 
} 

Answer 1

改變位置固定這樣的：

#overlay { 
    background: rgba(0,0,0,0.8); 
    width: 100%; 
    height: 100%; 
    position: fixed; 
    top: 0; 
    left: 0; 
    display: none; 
    text-align: center; 
}