HTML and CSS Reference
In-Depth Information
div h1 {
margin-left: -50px;
background: #999;
}
div h2 {
margin: 0 -50px;
background: #CCC;
}
[...]
<div>
<h1>Header 1 will break the left gutter</h1>
<h2>Header 2 will break both gutters</h2>
<p>Paragraph will respect both gutters</p>
</div>
There is a subtlety in the definition of the
auto
value for the left and
right margins that allows it to be used to center or right align blocks
inside their containing elements.
<div>
<p style="margin: 0 0 0 0;">margin: 0 0 0 0;</p>
</div>
<div>
<p style="margin: 0
auto
0 0;">margin: 0 auto 0 0;</p>
</div>
<div>
<p style="margin: 0
auto
0
auto
;">margin: 0 auto 0 auto;
</p>
</div>
