Home ~ ToC ~ Index ~ Refs ~ Feedback Known CSS Implementation Bugs
Last Modified: 31 December 1997

Problems with Horizontal Margin Properties

Platforms Demonstrating Problem

Netscape Navigator 4 (all platforms)
Internet Explorer 4 (all platforms)

Description of Problem

There are many small and not so small problems associated with horizontal margin properties. These are discussed collectively here, with workarounds, where available.

Percentage Margin Lengths Not Properly Evaluated

According to CSS, percentage margins should be evaluated relative to the width (or height)of the parent element. Howevre, both Netscape Navigator 4 and Internet Explorer 4 evaluate left and right percentage margin widths as a percentage of the browser window width, indepenednt of the width of the parent element. An example illustrating this is found in the document ex-lengths-b.html.
Proposed Workaround: Do not use percentage widths for margins, should this be a problem. You can instead use absolute or "em" units.

Negative Margins Do Not Always Work As Expected (Netscape Navigator 4)

Negative Margins do not always work as expected. This is illustrated in Figure ex-lengths-b.html. Here the second, third and fourth DIV elemetns are enclosed in a parent DIV with postive left and right margins (20%). The last DIV, however, has negative margins of -20% and -20% respectively, which should push the margins back outside those of the parent DIV. Netsacpe Navigator 4, however, does not let the right margin extend out beyond the right margin of the parent element.
Proposed Workaround: There is not simple workaround -- you must be careful to check cases with negative margins, to ensure that the document renders as required.


Prepared by: Ian Graham Known CSS Implementation Bugs
Last Modified: 31 December 1997