Can't figure out why background-color is including the margins!
Here is the code:

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>

	<head>
		<title></title>
		
		<style type="text/css">
		
		* {border: 0px; padding: 0px;}
		
		#greenbox
		{
			margin: 20px;
			border: 5px solid green;
		}	
		
		#redbox
		{
			background-color: red;
			margin: 20px;
			float:left;
			width:50%;
		}
		
		#bluebox
		{
			background-color: blue;
			margin: 20px;
			width: 50%;
		}
		
		
		</style>
	</head>
	<body>
	
		<div id="greenbox">
		
			<div id="redbox"> red box </div>
				
			<div id="bluebox"> blue box </div>

		</div>
	</body>
</html>

According to the W3C page, background-color should only 'color' the content, padding, and border area; not the margins. Yet although there is a 2`0px margin` between the red box and blue box text, it seems the background color of the blue box is including the top margin for some reason. I understand the concept of collapsing margins but it doesn't seem to make sense here.

Can anybody figure out what's going on?
Can't figure out why background-color is including the margins!
===

Here is the code:

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>

	<head>
		<title></title>
		
		<style type="text/css">
		
		* {border: 0px; padding: 0px;}
		
		#greenbox
		{
			margin: 20px;
			border: 5px solid green;
		}	
		
		#redbox
		{
			background-color: red;
			margin: 20px;
			float:left;
			width:50%;
		}
		
		#bluebox
		{
			background-color: blue;
			margin: 20px;
			width: 50%;
		}
		
		
		</style>
	</head>
	<body>
	
		<div id="greenbox">
		
			<div id="redbox"> red box </div>
				
			<div id="bluebox"> blue box </div>

		</div>
	</body>
</html>

According to the W3C page, background-color should only 'color' the content, padding, and border area; not the margins. Yet although there is a 2`0px margin` between the red box and blue box text, it seems the background color of the blue box is including the top margin for some reason. I understand the concept of collapsing margins but it doesn't seem to make sense here.

Can anybody figure out what's going on?