CSS格式不能使文章在手機上可讀

Question

如果您在桌面上訪問此blog article，您會看到段落位於中心。我能夠通過在每邊（左側和右側）填充200px來實現這一點。我這樣做是因爲我覺得文章更具可讀性，至少對於桌面用戶來說。

但是，如果您調整窗口大小，您會注意到段落也在移動，使得移動用戶無法閱讀。

有沒有辦法讓我解決這個問題？

注意：由於是Wordpress，因此文章上的所有元素都會自動包裝在p中。

Answer 1

從<p>中刪除內聯樣式並給它一個類。 然後刪除您在屏幕上給<p>的padding-right: 200px; padding-left:200px;。

@media screen and (max-width:600px) { 
padding-right: 10px; padding-left:10px; 
} 

Answer 2

你只需要做一些針對移動設備的CSS黑客攻擊。嘗試將其添加到樣式表的底部：

@media screen and (max-width:480px) { 

    div#main.fullpost p { 
    padding-left: 0 !important; 
    padding-right: 0 !important; 
    } 

}