Really easy margin problem

Get Started
1

Hi,

Sorry for the basic question, but Im a bit confused why my margins aren’t working on the #logo div.

here is the code:


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<link href="hisstylesheet.css" rel="stylesheet" type="text/css" />

<title>Untitled Document</title>

</head>

<body>

	<div id="wrapper">
    	<div id="header">
        	<div id="logo">
            </div><!-- end #logo -->
        
		</div><!-- end #header -->
	</div><!-- end #wrapper -->
</body>



</html>



@charset "utf-8";
/* CSS Document */

#wrapper {
  width: 850px;
  height: 650px;
  margin: 0 auto; /* this centers the page */
}

#header {
	background:url(navbar.jpg);
	background-position: left bottom;
	background-repeat:no-repeat;
	height:200px;
	
}

#logo {
	height:50px;
	margin:10px 10px 10px 20px;
}

Despite putting margins around the #logo it only seems to have an effect on the left hand side.

Or have I completely misunderstood margins and padding??? I wouldn’t be surprised. Here is the image.

Cheers

2

maybe it was bug or something.

3

hmmm, its now started working. strange.