隱私權聲明
本公司關心使用者隱私權與個人資訊,並遵守本公司的網站隱私政策,使用者若有任何問題,可以參考本公司的「網站隱私政策」,或利用電子郵件或連絡電話詢問本公司.
2014
08
04

視窗小於div寬度,捲軸右拉背景出現露白問題

關鍵字:網頁設計網頁設計作品

製作網站的時候,常常會使用到css背景色的效果,但之前碰到了好幾次,設定完內容div後,在div外再包一層div設定背景,但每當瀏覽視窗縮小,出現捲軸向右拉時,父層div背景就會露白的問題,如下圖:

內容div:寬990px
父層div背景:寬100%

正常應該為這樣,粉紅色的背景會延伸至整個畫面:


但當視窗縮小於內容div的寬度,出現捲軸時,捲軸拉至右側,就會發現父層div背景露出了一塊白底:


這時只要將父層div背景的設定改為:min-width:990px(與內容div同)就可以囉!

這是因為當背景width設為100%的時候,抓的其實是視窗的大小,所以當視窗小於裡面區塊的時候,右邊就會出現露白的情形了。只要將最小寬設定與裡面區塊相同,就可以解決啦!

小提醒:如果內容區塊有設定margin或padding,要記得把設定的寬度扣掉,不然還是會有一樣的情況喔!
你可能有興趣的作品案例
傑立資訊傑立資訊事業有限公司
Powered by AWS Cloud Computing

電話:(02)2739-9096 | 傳真:(02)2739-6637 | 客服:[email protected] | 臺北市信義區和平東路3段257號6樓map

© 2019 傑立資訊 All rights reserved.| 網站隱私政策

線上詢價