Re: CSS2 errata - border backgrounds

Ian Hickson wrote:
| 
| I assert that the spec actually says that the 
| background images should be relative and clipped to
| the padding edge,

That is true.

| while the background colours should be painted up to
| the border edge. This is implemented in at least two
| browsers (Netscape 6.x and Opera).

Yes, that behavior can be deduced from the Errata, but
not the original spec.

| According to the CSS2 spec, section 14.2.1, 
| background-position specifies the position of a 
| background image relative to the padding edge of a
| box, and tiling should cover only the content and
| padding areas of a box:

I don't dispute this.

| And, according to section 8.5.3, borders are drawn
| on top of a box's background:
| 
| #   All borders are drawn on top of the box's
|     background.
| 
| This logically means the background color should be
| underneath the border, but not the background image.

The logic of this behavior escapes me. /Logically/
backgrounds should have consistent confines.

http://fantasai.tripod.com/Mozilla/2001/border.html

| > I think it would be easier to correct the one
| > passing mention of background in the border area
| > in 8.5.3 than the five (or six) instances of just
| > content & padding.
| 
| The instances are already corrected -- see the
| errata. The only outstanding errata item is that
| the spec should more explicitly state that the 
| background images are clipped to the padding edge.

It's stated in several places already. The CSS2 spec
is very explicit about this.

| This testcase demonstrates why it is IMHO nicer for
| the background images not to overlap the border:

And I agree with you. The issue is further reinforced
if you imagine the use of background-size to fill the
background area with an image.

| Changing the spec at this point should be avoided
| if at all possible, since it would break at least
| two pre-existing implementations, namely Opera and
| Netscape.

Two implementations, each of which behaves differently,
neither of which have consistent dimensions for the
background area.


Here, I'll support the statement in my previous post:

Analysis of spec -

CSS1 explicitly places the borders on top of the
 element's background. (Section 5.5.17) I see no place
 where it contradicts this behavior.

The CSS2 spec, in four other places, refers to the
 behavior specified in 14.2, where 'background' is defined.
 Only in Section 8.5.3 does it extend 'background' to the
 border area.

 14.2 - In defining "background", the spec writes that it
        gets painted in the content and padding areas.
        Borders styles are mentioned in a separate sentence
        dealing with border properties.

 14.2 def 'background-image' - The spec writes that tiling
        only covers content and padding areas.
 14.2 def 'background-attachment' - The spec writes that a
        a background image is only visible within the
        padding and content areas.
 8.1 - The spec states that the backgrounds of the padding
        and content areas are specified by the background
        properties, but that the background of the border
        area is specified by the border properties. (This
        can make sense because content that overflows the
        border is rendered on top of it, not underneath it.)
 17.5.1 - The image depicting a table with background-
        colored, double-bordered cells does not show any of
        the background between the two stripes of border.

This leads me to believe that whoever wrote backgrounds
into the spec expected them to render in the content and
padding areas, but not the border area.

The CSS2 Errata, on the other hand, want to reconcile
with CSS1 and extend backgrounds to the border edge.
They haven't quite accomplished that--compare my list
above with the two errata that have been published.
The errata seem to support Mozilla's interpretation.

Browser testing results and comments:

Microsoft has background problems in any case: They
 render 0% 0% as upper left corner of the border edge,
 and I see nothing in either spec to support that
 interpretation.

 from 'background-position' - 
 "Initial: 0% 0%"
 ...
 "With a value pair of '0% 0%', the upper left corner of
 the image is aligned with the upper left corner of the
 box's padding edge."
       ^^^^^^^^^^^^

 MSIE extends both background color and background
 images to the border edge.

 *BUT* they render according to 14.2 for table elements,
 (for which backgrounds are used much more extensively
 by authors than for block elements.)

 So MSIE needs to change it's background rendering
 regardless of whether the spec changes or not.

Opera is also not consistent in its interpretation. If
 there is just a background color, it behaves according
 to Section 8.5.3. However, if there is a background
 image, it follows 14.2. They should choose either one
 or the other.

Mozilla behaves similar to Opera, in that it only 
 extends the tiled image to the padding edge. However,
 unlike Opera, it paints that image over a background
 color extending to the border edge. This, too, is
 inconsistent. 

Amaya, the W3C browser, behaves according to section 14.2,
 based on testing 'double' (since the copy I have [v5.1]
 does not support 'dashed' or 'dotted').

Conclusions - 

  The CSS2 spec almost completely concurs with the
  statement confining backgrounds in the content and
  padding areas, while the CSS1 spec is completely
  devoted to extending backgrounds to the border
  edge. The CSS2 Errata shift CSS2 halfway towards
  CSS1 behavior, which is neither here nor there,
  but equivocating somewhere in between.

  Microsoft would probably gain more than it would
  lose by choosing to render per 14.2. Opera has
  nothing to lose by choosing one over the other;
  the same goes for Mozilla. Amaya is already
  rendering according to 14.2.


Thus my previous comment:

 > ...even though CSS1 explicitly paints borders on
 > top of the background, with the current state of
 > browser implementations and CSS2 wording, I think
 > it would be easier to correct the one passing
 > mention of background in the border area in 8.5.3
 > than the five (or six) instances of just content
 > & padding.

~fantasai

Received on Sunday, 29 July 2001 18:39:29 UTC