DIV標記根據內容更改大小

我正在使用HTML和CSS進行遊戲。在現階段，我有以下幾點：DIV標記根據內容更改大小

/*Reset margins & padding*/ 
body, h1, h2, h3, h4, h5, h6, p, div, ul, li { 
    margin: 0; 
    padding: 0; 
} 

body { 
    background: #CCCCCC; 
    font-family: sans-serif; 
    color: #000; 
} 

#divWrapper { 
    width: 90%; 
    margin: 0 auto; 
} 

#divHeader { 
    width: 100%; 
    background: #CC0000; 
    text-align: center; 

    /* Margins */ 
    margin-top: 20px; 
    margin-bottom: 0px; 

    /* Radius */ 
    border-radius: 5px; 
} 

#divMenuStrip { 
    width: 100%; 
    background: #646464; 
    text-align: center; 

    /* Margins */ 
    margin-top: 10px; 

    /* Padding */ 
    padding-left: 5px; 
    padding-right: 5px; 


    /* Radius */ 
    border-radius: 5px; 
} 

#divContent { 
    width: 100%; 
    background: #ffffff; 

    /* Margins */ 
    margin-top: 10px; 

    /* Padding */ 
    padding: 8px; 

    /* Radius */ 
    border-radius: 5px; 
}

AND ...

<!DOCTYPE html> 
<html> 
    <head> 
     <link rel="stylesheet" type="text/css" href="./styles/main.css"> 
    </head> 

    <body> 
     <div id="divWrapper"> 

       <div id="divHeader"><img src="./images/headers/header-1.jpg" /></div> 
       <div id="divMenuStrip">This is where the menu will be displayed</div> 
       <div id="divContent">This is where the content will be displayed. This is where the content will be displayed. This is where the content will be displayed. This is where the content will be displayed. This is where the content will be displayed. This is where the content will be displayed. This is where the content will be displayed. This is where the content will be displayed. This is where the content will be displayed. This is where the content will be displayed. This is where the content will be displayed. This is where the content will be displayed. This is where the content will be displayed. This is where the content will be displayed. This is where the content will be displayed. This is where the content will be displayed. This is where the content will be displayed. This is where the content will be displayed. This is where the content will be displayed. This is where the content will be displayed. This is where the content will be displayed. This is where the content will be displayed. This is where the content will be displayed. This is where the content will be displayed. This is where the content will be displayed. This is where the content will be displayed. This is where the content will be displayed. This is where the content will be displayed. This is where the content will be displayed. This is where the content will be displayed. This is where the content will be displayed. This is where the content will be displayed. This is where the content will be displayed. This is where the content will be displayed. This is where the content will be displayed. This is where the content will be displayed. This is where the content will be displayed. This is where the content will be displayed. This is where the content will be displayed. This is where the content will be displayed. This is where the content will be displayed. This is where the content will be displayed. This is where the content will be displayed. </div> 
     </div> 
    </body> 
</html>

當我在我的網頁瀏覽器加載HTML網頁雖然根據內容量專區內出現標籤是文字正在影響我的div標籤的大小。

任何人都可以闡明爲什麼這是什麼？謝謝！！！

來源

2013-05-06 vlocity160

請設置高度 – ShibinRagh 2013-05-06 09:20:44

您能更具體一點嗎？根據其性質，divs和其他此類元素擴展以適應其內容。（避免在上面設置高度，在大多數情況下，這是佈局災難的祕訣。） – 2013-05-06 09:20:59

設置高度對不對？我想將整個網站的內容限制在網頁的90％（因爲包裝設置爲90％）。然後我希望其他每個div都能成爲完整的寬度。這是整個屏幕分辨率的90％。 – vlocity160 2013-05-06 09:21:33

這是默認情況下div的行爲。如果你想讓它顯示了一定的高度，你將不得不與

height:XXpx;

指定它背後的原因，這是內容這幾天都是動態變化即很多，隨着時間的推移。每次內容改變時手動改變高度會很麻煩。

來源

2013-05-06 09:23:26 TDsouza

對不起，但別人有任何迴應？ :-) – vlocity160 2013-05-07 01:30:39

我經歷了你的意見，我想我的問題是你的問題。你能解釋一下你在找什麼嗎？它是你想要固定的高度還是寬度？ – TDsouza 2013-05-09 06:46:46

DIV標記根據內容更改大小

回答

相關問題