Composites are often drafted in exhaustive detail, and contract terms can require reproduction of comped layouts at pixel-level accuracy, or at least pixel-level consistency. Element size control is only part of the solution; whitespace and rule (border) control is no less important, and the properties used to effect that control carry a few caveats with their use.
Apart from values assigned to the properties used to control element positioning, the only layout values that can take on negative values are those attached to the various margin properties.
When an affected element is assigned a negative margin value, the element’s computed box bleeds into whatever element box might lie adjacent to the negative margin.
As implied by their nature, negative margins
remove whitespace from a layout instead of adding
it. This capacity is more important than it may seem at first glance.
For example, consider a heading trailed by interposed whitespace and a
custom rule, presumably added with the
property. If the site design intends this heading to appear in tandem
with metadata—as might well be the case with the title of a blog
post—the metadata most likely will follow the heading immediately in the
markup, and will in turn be followed by the post content itself, as
shown in Figure 6-4.
Figure 6-4. Tandem title and metadata using negative ...