如何防止切割背景？

我在＃section-content中設置背景圖像，背景爲repeat-x，並在＃section-footer中設置背景顏色。問題在於背景被第一次看到的空間所削減。如何防止切割背景？

有什麼辦法解決這個問題嗎？

有有問題的圖像，你可以看到，頁腳背景色被切斷時爲分辨率或窗口小，我向右滾動...

Problem image

來源

2013-07-16 mixerowsky

你能爲你的問題提供了源代碼或上下文？當它很模糊時很難解決 – Jnatalzia

不知道你在說什麼。製作一個jsFiddle或向我們展示一些代碼/屏幕截圖。 – Pieter

我在CMS工作，它的小複雜，提供源代碼，我編輯我的問題，你可以看到有問題的圖像... – mixerowsky

您需要定義最小寬度頁腳。考慮你的主頁面包裝的寬度：980px;然後分配min-width：980px;到頁腳元素。當您調整瀏覽器窗口的大小時，頁腳知道他必須將背景重複指定爲最小寬度，即使您的頁面進行了水平滾動。

來源

2013-07-16 17:45:43 Dipak

謝謝，這是幫助我很多... – mixerowsky

@mixerowsky順便說一句 - 即使StackOverflow與它的頁腳背景顏色有相同的問題。調整大小，直到它獲得水平滾動並查看:) – Dipak

我的HTML結構看起來像這樣

<div id="page"> 
    <div id="section-header"> 
    ... 
    </div> 
    <div id="section-content"> 
    ... 
    </div> 
    <div id="section-footer"> 
    ... 
    </div> 
</div>

，所以我加入CSS

#page { 
    margin: auto; 
    overflow: hidden; 
    min-width: 1180px; /* it fits on my site */ 
}

和問題解決...

來源

2013-07-16 17:53:25 mixerowsky

如何防止切割背景？

回答

相關問題