- From: Håkon Wium Lie <howcome@opera.com>
- Date: Mon, 26 Jan 2009 01:08:51 +0100
- 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 UTC