RichInStyle.com test pages: boxes - <BR> test

Although CSS2 does not explicitly state what the behavior of <BR> is, CSS1 suggested that it should not be a 'special case'. There are essentially two interpretations:

1. That it should be treated in the same way as a natural line break, but instead terminating the line earlier - not treated as an element for the purposes of line box calculations, not given a width, etc.
2. That it should be treated as an empty inline non-replaced element with a generated line break.

The first of these is to preferred for the following reasons:

1. It does not distort line box heights
2. It is artificial to treat it as generated content
3. It gives confusing results - why should forced line breaks behave differently from ordinary ones
4. The second option is fundamentally flawed in that UAs could just as well have BR:before {content: "\A"} as BR:after {content: "\A"}, which leads to differing results.

Here's a <BR> element:
The br element above should be preceded by a block of red.

Bi9.
Text.

If 'Text' doesn't overlap with Bi9, the browser is treating it as BR:before. If so, here's a test:

BR:before test

There should not be a line break here:
due to a content: "".

Bi9.
Text.

If 'Text' doesn't overlap with Bi9, the browser is treating it as BR:before. If so, here's a test:

BR:after test

There should not be a line break here:
due to a content: "".

Copyright © RichInStyle.com 2000; all rights reserved. See copyright document for terms of use. Please visit Bukit Lawang flood appeal.