表溢出父元素

Question

在this page的頂部，有一個HTML表格顯示有關節日的摘要信息。表格的一行顯示節日網站的網址。如果瀏覽器是窄（如手機），網址爲長，這會導致表溢出它的父，如下所示：

理想情況下，我想URL的可見部分如果它太長，不能顯示在可用的空間被截斷，所以在試圖達到這個我補充說：

overflow: hidden; 

到相關的表格單元格，但沒有奏效。然後我試圖使URL包裝超過2行與規則

word-wrap: break-word; 

但這也沒有奏效。當URL很長時，我該如何防止這個表溢出它的父級？

Answer 1

table-layout:fixed應該通過一些調整來解決這個問題。 overflow:hidden原因在單元本身上不起作用的原因是因爲它實際上並未被截斷，因爲默認情況下該表增長以適應其所有內容 - 低。有是沒有溢出隱藏。通過將表格的佈局策略從默認自動切換到固定，它實際上能夠剪輯其內容。

Answer 2

集

#overview > table { 
    table-layout: fixed; 
} 

使<table/>尊重width而忽略了可能的內容溢出和

#overview > table a { 
    word-wrap: break-word; 
} 

讓鏈接斷開行。