我的紅色邊框怎麼沒有環繞我的文本div和我的邊欄div div

Question

我的紅色邊框怎麼沒有環繞我的文本div和我的邊欄div。這裏是我的代碼：

CSS：

body{ 

background-color: #d7d7d7; 
color: #666666; 
font-family: arial, sans-serif; 
font-size: x-small; 
} 

div#header { 
background-color: #323232; 
height: 140px; 
width: 950px; 
} 

div#maincontainer { 
background-color: #d7d7d7; 
width: 950px; 
height: auto; 
margin-top: 5px; 
border: 1px solid red; 

} 

div#maintextcontainer{ 
//background-color: #333333; 
width: 640px; 
//margin-right: 10px; 
margin: 1px; 
float: left; 
color: black; 
} 

div#maintextcontainer h2{ 
color: #4f4f4f; 
} 

div#sidebarcontainer { 
//background-color: #333333; 
width: 300px; 
float: left; 
color: black; 
margin: 1px; 

} 

div#footer{ 
background-color: #323232; 
width: 950px; 
margin-top: 5px; 
clear: left; 
} 
div#global{ 
width: 950px; 
margin: auto; 
} 

HTML：

<div id="global"> 
<div id="header"> This is the header div</div> 
<div id="maincontainer"> 
<div id="maintextcontainer">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi aliquam neque eu turpis euismod eget suscipit nulla ultrices. Donec sagittis mi non sem vestibulum elementum dapibus risus auctor. Praesent tristique laoreet dapibus. Integer vel ligula lorem, et pharetra lorem. 
</div> 
<div id="sidebarcontainer">Nam at lectus vitae est tempor lacinia sed et ante. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Praesent interdum mi id nisi aliquet pulvinar. 
</div> 
</div> 
<div id="footer">This is Footer Text</div> 
</div> 

Answer 1

您需要添加overflow:auto;到div#maincontainer。除非設置了該屬性，否則浮動元素將流入其包含元素之外。

此外，雙斜槓（//）不是CSS中的有效註釋符號。