HTML and CSS Reference
In-Depth Information
space to reserve around the element. In addition, the keyword auto tells
the styles-conscious browser to revert to the margins it normally would
place around an element. Percentage values are computed as a percent-
age of the containing element's width. The default margin, if not speci-
fied, is 0.
These are all valid margin settings:
body {margin-left: 1in; margin-top: 0.5in; margin-right: 1in}
p {margin-left: -0.5cm}
img {margin-left: 10%}
The first example creates 1-inch margins down the right and left edges
of the entire document and a 0.5-inch margin across the top of the doc-
ument. The second example shifts the left edge of the <p> tag 0.5 cen-
timeters left, into the left margin. The last example creates a margin
to the left of the <img> tag equal to 10 percent of the parent element's
As you can the shorthand border property, you can use the shorthand
margin property to define all four margins, using from one to four values,
which affect the margins in the order described in Table 8-1 . Using this
notation, our <body> margins in the previous example could also have
been specified as:
body {margin: 0.5in 1in}
The margin-left and margin-right properties interact with the width
property to determine the total width of an element, as described earlier
in section .
All the popular browsers support the margin properties and values.
Search WWH ::

Custom Search