Safari瀏覽器動態瀏覽器高度檢測

Question

我試圖讓頁腳粘到瀏覽器窗口的按鈕上。它適用於Chrome，但不適用於Safari或移動Safari。

我在css中使用了calc函數。在Safari上，footer在potrait和landscape模式下都處於相同的絕對位置。它似乎沒有檢測/刷新瀏覽器高度的變化，在Chrome上正常工作。

#footer{ 
    position:absolute; 
    -webkit-top: calc(100% - 127px); 
    top: calc(100% - 127px); 
    height: auto; 
    width: 100%; 
    clear:both; 
    overflow:hidden; 
} 

如何強制Safari瀏覽器刷新瀏覽器高度？

Answer 1

前綴calc()正確的方法是這樣的：

#footer{ 
    position:absolute; 
    top: -webkit-calc(100% - 127px); 
    top: calc(100% - 127px); 
    height: auto; 
    width: 100%; 
    overflow:hidden; 
} 

但是，絕對在頁面的底部定位的元素通常是通過設置底屬性，它具有更大的瀏覽器支持完成：

#footer{ 
    position:absolute; 
    bottom: 0; 
    height: auto; 
    width: 100%; 
    overflow:hidden; 
}