WordPresspress：在響應式視圖中容器不佔滿全部寬度

我一直在閱讀這裏的提示很長一段時間，並獲得了很多幫助。今天，我需要個人幫助...WordPresspress：在響應式視圖中容器不佔滿全部寬度

響應式視圖（< 1024像素）應該是全寬並居中有一點填充。填充工作正常，但內容不能在右側完成大量頁面。我嘗試了這裏列出的所有css調整。實際的自定義CSS代碼：

@media only screen and (max-width: 1024px){ 
#boxed, html, body, div.container.main-content 
{ 
width:  100% !important; 
margin:  0px; 
} 
.row 
{ 
margin:  0px !important; 
width:  100% !important; 
padding: 15px !important; 
} 
.container, .container-wrap 
{ 
margin:  0px !important; 
width:  100% !important; 
padding: 0px !important; 
} 
}

該網站是www.timschuermann.com/dev/

感謝您的幫助提前

添

更新1

謝謝您的快速解答！我嘗試了所有的建議，但仍然無效。

實際的代碼是：

@media only screen and (max-width: 1024px){ 
div.container.main-content 
{ 
width:  100% !important; 
margin:  15px auto !important; 
} 
#boxed, html, body 
{ 
width:  100%; 
margin:  0px; 
} 
.row 
{ 
width:  100%; 
margin:  0px; 
padding: 0px; 
} 
.container, .container-wrap 
{ 
margin:  0px; 
width:  100%; 
padding: 0px; 
} 
}

實際設計正是一個我「外的即用」。

我希望顯示的內容更大，左右邊距15px。

但也有一個新問題：在我的iPhone上有空白房間，灰色，內容上方。重裝後它消失了？

我希望你明白我的意思，並可以幫助我。

在此先感謝

添

來源

2017-04-24 g4bb4g4nd4lf

建議的話，停止使用'！important'，如果樣式表正確級聯，則不需要'012'''重要' –

用'max-width：inherit'覆蓋最大寬度。 –

在'responsive.css'文件中有四個不同的CSS規則，它們包含多個'max-width'設置 - 在行上。它們都包含「重要」。只需在窄窗口中查看瀏覽器檢查器中的CSS，然後您就會看到這些設置。 – Johannes

請避免使用!important。當你需要稍後改變你的樣式表時，它會讓你很難。

要將容器居中，請添加以下內容。

div.container.main-content { 
    margin: 0 auto; 
    max-width: inherit; 
}

來源

2017-04-24 15:16:01 Mary

太多「！重要」是不需要的是導致css overiding問題。但要修復，你必須使用尤爾本期「！重要的」，因爲同樣的元素

@media only screen and (max-width: 1024px) { 
div.container.main-content { 
    width: 100% !important; 
    margin: 0px; 
    margin: 0 auto !important;/**Added This **/ 
} 
}

但會建議，當你有時間去修改你的代碼在以前使用的，以去除多餘的人的。希望這可以幫助。

來源

2017-04-24 15:37:14 blecaf

WordPresspress：在響應式視圖中容器不佔滿全部寬度

回答

相關問題