CSS左，右div背景問題

我有兩個div。一個用於左側菜單，另一個用於右側內容。左邊的菜單有一個背景圖像，但它不能拉伸100％的網站。CSS左，右div背景問題

#main_wrapper{ 
 

 
} 
 
#main_left{ 
 
    float: left; 
 
    background: #fbfcff url("gfx/main_left_bg.jpg") repeat-y top right; 
 
    width: 210px; 
 
} 
 
#main_right{ 
 
    width: auto; 
 
    overflow: hidden; 
 
    padding: 0px 30px 0px 30px; 
 
}

<div id="main_wrapper"> 
 
    <div id="main_left"></div> 
 
    <div id="main_right"></div> 
 
</div>

來源

2017-03-03 Solo

你是什麼意思？如果背景橫跨整個站點，則必須將其分配給「body」，而不是分配給任何DIV – Johannes

如果將寬度設置爲固定的210px值，爲什麼它會伸展100％？ – mnemosdev

你必須設置你的主包裝的高度100vh如果你想它的孩子拉伸窗口的整個高度。

#main_wrapper { 
 
    height: 100vh;; 
 
    width: 100vw; 
 
} 
 

 
#main_left { 
 
    float: left; 
 
    width: 210px; 
 
    
 
    background-image: url(http://www.planwallpaper.com/static/images/518079-background-hd.jpg); 
 
    background-size: cover; 
 
    background-position: center; 
 
    background-repeat: no-repeat; 
 
    
 
    border-right: 1px solid white; 
 
    height: 100%; 
 
} 
 
#main_right { 
 
    float: left; 
 
    width: auto; 
 
    
 
    height: 100%; 
 
}

<div id="main_wrapper"> 
 
    <div id="main_left"></div> 
 
    <div id="main_right"></div> 
 
</div>

來源

2017-03-03 14:17:45 zsawaf

CSS左，右div背景問題

回答

相關問題