如何阻止內容溢出其容器？

我發現以下站點的接觸部分持續在底部蔓延，特別是當窗口寬度減少到手機大小：如何阻止內容溢出其容器？

http://phixhut.com/test/1page/onepage.html#contact

的CSS我對覆蓋節：

-webkit-transition: all 500ms ease; 
transition: all 500ms ease; 
padding: 55px 0 15px 0; 
width: 100%; 
background-color: #83aa30; 
background-color: rgba(131, 170, 48, 0.6); 
background-image: url("../images/GPlay.svg"); 
position: absolute; 
bottom: 0px; 
top: 0px;

如果我刪除了「top：0px」，但底部的溢出消失了，但它似乎溢出了頂部。

不知道如何去取得聯繫部分調整大小pefectly停止這些溢出。任何幫助將不勝感激！

來源

2015-07-13 user1898662

看來你正在尋找溢出：隱藏 – nikhil

或溢出：汽車;如果你想div可以滾動，也應該設置高度。 – OSDM

-1

的解決方案，雖然效率不高，會overflow: hidden

你不應該使用，但是，因爲大部分的時間使用的是從根本上隱藏不需要的代碼。相反，嘗試在CSS中解決問題而不使用overflow：hidden，以便在調整大小時不會溢出。

您可以通過確保某些項目未設置爲固定寬度或高度來實現，因爲如果屏幕分辨率小於此值，則會溢出。

希望有所幫助。

來源

2015-07-13 10:57:29 Lansana

有幾件事是造成你的問題，但排序它會刪除你當前height爲class="contact"，並將其設置爲您overlay容器height最簡單的方法。

我個人會重寫你的代碼。

把你的地圖和覆蓋圖作爲一個背景圖像並刪除你的絕對定位和你在那裏的額外的div會更有意義。

它會A.簡化你的代碼和B.減少HTTP請求的數量C.你的網站會在你以後的流動性中起作用。

來源

2015-07-13 11:09:29 DCdaz

如何阻止內容溢出其容器？

回答

相關問題