如何從我的網站的右側刪除不必要的保證金

Question

我的WordPress網站使用Quidus主題包含從右邊看起來非常糟糕的不必要空間。請幫忙：我怎樣才能刪除這個空間？我想讓我的網頁填滿整個屏幕。右側或左側不需要保證金。

Look at the image provided below of my website.

My Website Link is here

注：我希望所有的職位，以適合屏幕全寬。

Answer 1

你的HTML結構是：

<div id="page"> 
    <div class="site-content"></div> 
    <div class="right-sidebar-wrapper"></div> 
</div> 

你的CSS是：

@media screen and (min-width: 955px) { 
    .site { 
    max-width: 1718px; 
    } 
} 

@media screen and (min-width: 1105px) { 
    .site-content { 
    width: 56%; 
    } 
} 

@media screen and (max-width: 1105px) and (min-width: 955px) { 
    .site-content { 
    width: 70%; 
    } 
} 

@media screen and (max-width: 480px) { 
    .right-sidebar-wrapper { 
    width: 100%; 
    } 
} 

@media screen and (max-width: 768px) and (min-width: 480px) { 
    .right-sidebar-wrapper { 
    width: 100%; 
    } 
} 

@media screen and (max-width: 1105px) and (min-width: 955px) { 
    .right-sidebar-wrapper { 
    width: 70%; 
    } 
} 

@media screen and (min-width: 1105px) { 
    .right-sidebar-wrapper { 
    width: 22%; 
    } 
} 

與你的CSS問題是.site-content和.right-sidebar-wrapper寬度不讓它他們的父母的100％。

讓我們闡明：

• 在窗口寬度> 1105px .site-content = 56％，而.right-sidebar-wrapper = 22％，從而56％+ 22％= 78％，但100％ - 78％= 22％，這是在餘量在窗口寬度來自在該分辨率

• > 955和 = 70％和.right-sidebar-wrapper = 70％，這使得下面.site-content因爲70％+ 70％= 140％的右側欄顯示，以便#page不能包含在同一個地方線

要所以他們對父母的寬度的100％，你希望他們彼此相鄰，顯示分辨率解決這一變化.site-content和.right-sidebar-wrapper其寬度CSS規則。

可能的解決方法是改變：

@media screen and (min-width: 1105px) { 
    .site-content { 
    width: 56%; 
    } 
} 

@media screen and (max-width: 1105px) and (min-width: 955px) { 
    .right-sidebar-wrapper { 
    width: 70%; 
    } 
} 

到：

@media screen and (min-width: 1105px) { 
    .site-content { 
    width: 78%; 
    } 
} 

@media screen and (max-width: 1105px) and (min-width: 955px) { 
    .right-sidebar-wrapper { 
    width: 30%; 
    } 
}