段落重疊在智能手機上

Question

我使用引導程序模板並僅在智能手機（iPhone 6，Safari）上重疊段落。即使將瀏覽器窗口縮小至最小尺寸以進行測試，也能在瀏覽器上正常工作。手機上的兩行發生重疊。

在CSS中沒有最大高度。這是段落的css：

.about-grid p { 
    padding:0 0 0.5em 0; 
    color: #333; 
    font-size: 1.1em; 
    line-height: 1.4em; 
    font-family: 'Arimo', sans-serif; 
} 

你也可以see the full web page online。

Answer 1

It's修復很簡單：

在style.css中的1279線已斷點宣佈

@media (max-width: 320px) 

和線1391你有這個類：

.about-grid p { 
     height: 50px; 
     font-size: 1em; 
    } 

高度迫使您的文本塊只有50px高，並且因爲您沒有「溢出：隱藏」;文本溢出並最終重疊在其他所有內容上。它也會發生，如果你讓你的瀏覽器窗口非常小，而不僅僅是智能手機。

您只需刪除該高度聲明即可。如果您因爲某種原因需要它，只需添加一個新類並使其更具體。

希望它有幫助:)