W3C home > Mailing lists > Public > www-style@w3.org > January 1998

Re: Conflict resolution between width and margin properties

From: Bert Bos <Bert.Bos@sophia.inria.fr>
Date: Mon, 19 Jan 1998 01:58:27 +0100
Message-Id: <199801190058.BAA01064@hyctia.inria.fr>
To: www-style@w3.org
Todd Fahrner writes:
 > There's a discrepancy between the ways NS4 and IE4 handle the following
 > situation, and I don't know which is correct - does anybody? The case:
 > Suppose I have a textual element set to be 36em wide (to keep lines from
 > running too long based on the font size). In addition to setting a width, I
 > specify left and right margins of 16% and 8%, respectively. 
 > In NS4, this behaves nicely (except the em unit is incorrectly large, and
 > the percentage reckoning doesn't start at the window edge but the "body
 > offset edge"). When the window is very wide, the left edge of the element is
 > at around 16% of the window width, but the width of the column does not
 > exceed 36em. When the window is very narrow, the margin properties override
 > the width property, and the element becomes narrower than 36em. No clipping.
 > In IE4, all is well until you make the window very narrow. Here, the width
 > property overrides the margin properties, and clipping occurs. Note that you
 > can set a width only on the DIV element in IE4, not on anything more useful
 > like common paragraphs or BODY.

CSS1 says that the width is always honoured, and if both margins are
set to something else then 'auto', than the right margin is ignored
(or rather, treated as 'auto').

Your textual element should therefore be 36em wide, independent of the
window size. The left margin (16%) depends on the parent element (and,
eventually, probably on the window size), while the right margin is
whatever is left.

I can't test MSIE right now, but my copy of NS4.0 (Linux) seems to
work (like you descibe) OK as long as the window is wider than the sum
of margins and width, but fails to honour the width otherwise.

From your description I gather that MSIE4 is correct.

Note that in CSS2 there are extra properties min-width and max-width,
which gives you some more control over text in very wide or very
narrow windows.

For right-to-left text, CSS2 also describes that the left, rather than
the right margin is ignored in an overconstrained situation.

  Bert Bos                                ( W 3 C ) http://www.w3.org/
  http://www.w3.org/people/bos/                              W3C/INRIA
  bert@w3.org                             2004 Rt des Lucioles / BP 93
  +33 4 93 65 76 92               06902 Sophia Antipolis Cedex, France
  +33 (0)4 92 38 76 92 (<--- after 5 Jan 1998)
Received on Monday, 19 January 1998 05:56:37 UTC

This archive was generated by hypermail 2.3.1 : Monday, 2 May 2016 14:26:46 UTC