<html>
<head>
<style type="text/css">
h1{
background-color: red;
margin-top : 10px;
}
div{
background-color:black;
height : 100px;
}
</style>
</head>
<body>
<div>
<h1>Hello World!</h1>
</div>
</body>
Starting from the above code, how can I get the h1(Helloworld) to have a margin with the div, not the body?
This is the desired result: http://img176.imageshack.us/img176/7378/aaawj.png

I have found that if you set a padding on the container element you can avoid the problem you’re experiencing. This should do it.