In Figure 11-2, by contrast, you see the effect of adding a CSS style employing
auto. Here’s the code that causes the paragraph to freeze in one position
(a stable distance from the left side of the parent browser window, in this
example):<html>
<head><style>p {width: 150px; margin-right: auto;margin-left:
150px;border: 2px solid;}</style>
</head><body><p>This paragraph’s right margin is set to auto. The box
dimensions are not necessarily the same as the
visible contents, or the visible border. If
padding is used, then the box grows to include the
padding dimensions. If a border or margin are
further added, they, too, grow the size of the
box.
</p>
</body>
</html>Figure 11-2:
With the
right margin
set to auto
and the left
margin and
width
specified,
this text
doesn’t
move or
resize when
the user
resizes the
window.