移動視圖中有很多邊緣！太多！重要標籤

Question

我在我的網站上遇到問題。它在桌面視圖中看起來很好，但在移動視圖中有一個很大的右邊距，會扭曲邊欄。這是鏈接到頁面。 https://www.bearcountrybees.com/store/

如果您對我應該怎麼做才能解決這個問題有任何意見，那就太棒了。謝謝！

Answer 1

這可能是因爲你設置的數值作爲包裝用important寬度，它應該是移動屏幕100％，並儘量避免使用important原因覆蓋它們，我們將不得不使用更多的important「s.Like ，

@media only screen and (max-width: 767px) { 
.bSe right, 
.sAsCont .sAs { 
    width: 100%; 
} 
} 

如果確實需要使用important即。

@media only screen and (max-width: 767px) { 
.bSe right, 
.sAsCont .sAs { 
    width: 100% !important; 
} 
} 

Answer 2

從我看到你沒有使用任何像BootStrap框架爲您的網站。從下次開始，請使用框架，它會爲您解決很多問題。

您可以在這樣的手機屏幕上將側欄加寬爲全寬。

@media only screen and (max-width: 767px) { 
.sAs { 
    width: 100% !important; 
} 
} 

Answer 3

你有應用在.bSeCont .bSe太多的寬度，做CSS的最好辦法是給你的，最後一個是導致你的頁面是具有在大比分規則右邊是.bSeCont .bSe {寬度：67％！重要; }上線409來修復是你要非常具體的關於你的CSS能夠重寫......試試這個方法之一...

.cnt .bSeCont .bSe.right { width: 100%!important; }