Flexbox頁腳元素不會粘在IE11底部

我正在使用Flexbox佈局網站，IE11播放效果不佳。頁腳元素應該位於頁面的底部或內容的底部，以較長者爲準。這在所有其他瀏覽器（包括IE10）中都能正常工作。但在IE11中，它並不粘在頁面的底部。根據https://msdn.microsoft.com/en-us/library/jj127304(v=vs.85).aspxjustify-content屬性不需要任何供應商前綴。是什麼賦予了？爲什麼在IE11中打破而不是IE10？Flexbox頁腳元素不會粘在IE11底部

這裏是我的工作活頁：https://www.tntech.edu/dev/ttu15.interior

來源

2016-01-19 dev_willis

這裏嘗試使用**置頂頁腳使用Flex這個例子** https://philipwalton.github.io/solved-by-flexbox/demos/sticky-頁腳/也許你解決它給你的容器一個高度 – luso

你正在使用'

'元素在flex容器中包裝一個部分。所以有一點需要考慮的是IE11（和IE10）不支持'

'。 http://caniuse.com/#feat=html5semantic –

好抓@Michael_B。 –

有在http://philipwalton.com/articles/normalizing-cross-browser-flexbox-bugs/全面的解釋一讀。

實際的解決方案應用以下更改

#rap{height:100vh;}/*change min-height to height*/ 
#rap > header, 
#rap > footer{flex-shrink:0} 
#rap > main{flex: 1 0 auto;}

來源

2016-01-20 01:29:30

這看起來會使頁腳變得粘稠。我希望頁腳位於內容的末尾或頁面的底部，以較長者爲準。 –

我提供的'#rap> main'應該應用而不是現有的。（*你的上一個目前正在申請，因爲它低於CSS文件中的新的*） –

啊！我顯然意外地在兩個不同的地方引用了這個元素，而我沒有看到第二個元素。謝謝！它現在完美。 –

Flexbox頁腳元素不會粘在IE11底部

回答

相關問題