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

[css3-background] stacking order of border image

From: Håkon Wium Lie <howcome@opera.com>
Date: Mon, 26 Jan 2009 01:08:51 +0100
Message-ID: <18812.65299.575782.61512@opera.com>
To: www-style@w3.org

I'm playing with backgrounds and borders. Fun stuff!

In:

  http://dev.w3.org/csswg/css3-background/

we find:

  Note that the 'border-image' property can also define a background
  image, which, if present, is painted on top of the background
  created by the background properties.

Some comments:

 - first, I think the text about stacking order should be normative;
   perhaps it should go here:

      http://dev.w3.org/csswg/css3-background/#border-image

 - however, I'm not sure if I like the described behavior, for several
   reasons:

 1) it seems counter-intuitive that 'border-image' should override the
    more purpose-built background properties

 2) at a more practical level, the described behavior will create more
    manual work. Consider this image:

     http://people.opera.com/howcome/2009/tests/borders/picture.jpg

    I'd like to use the frame in the picture in other contexts. To do
    so, however, I need to edit the picture to:

    -- remove the man inside and replace him with a transparent field
    -- save it in a format that supports transparency (i.e., not jpg)

    Rather, I'd like to use the jpg image directly and just set a
    background on the element to cover the man:

      div { 
        background: black;
        border-image: url(picture.jpg) 125 125 125 125 stretch stretch;
      }

So, how about placing the background from the 'border-image' be at the
bottom of the stack instead? Or, perhaps even simpler, just clip the
middle part of the borders image (the one rectangle which is not used
as a border)?

Also, there's a typo in this sentence:

  An inner box-shadow casts a shadow as if everything outside the
  padding edge were opaque. The inner shadow is drawn inside the
  padding edge only: it is not drawn in outside the padding box of the
  element.

The word 'in' should be removed, I believe.

-h&kon
              Håkon Wium Lie                          CTO °þe®ª
howcome@opera.com                  http://people.opera.com/howcome
Received on Monday, 26 January 2009 00:09:27 GMT

This archive was generated by hypermail 2.3.1 : Tuesday, 26 March 2013 17:20:15 GMT