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

Re: Border-Images and oversized corners: CSS Backgrounds and Borders Module Level 3

From: fantasai <fantasai.lists@inkedblade.net>
Date: Sat, 03 Oct 2009 00:35:58 -0700
Message-ID: <4AC6FEDE.2000406@inkedblade.net>
To: Brad Kemper <brad.kemper@gmail.com>
CC: www-style list <www-style@w3.org>
Brad Kemper wrote:
> I'm looking at the editor's Draft of the "CSS Backgrounds and Borders 
> Module Level 3". I noticed that in 5.3 'border-image-width' that it says 
> the following:
> 
> If two opposite ‘|border-image-width 
> <http://dev.w3.org/csswg/css3-background/#border-image-width>|’ offsets 
> are large enough that they overlap, then their used values are 
> proportionally reduced until they no longer overlap.
> 
> That is a good idea, because it sounds like I can use 'border-image' 
> analogously to 'border-radius' when the box is too small for the 
> specified values, as I think it should. But I wonder if we should be a 
> bit more explicit, with language and formula matching that of 
> 'border-radius', which says this:
> ...
> That does make it clear (-ish) that all offsets are reduced 
> proportionally, not just the two opposite offsets (if I understand this 
> formula correctly). If it was just the two opposite offsets, there would 
> be unwanted distortion, and an unwanted difference between rounded 
> corners created via 'border-radius' and rounded corner images used in 
> 'border-image'. On the other had, maybe this formula could be stated 
> more simply for both border-radius and border-image?

Ok, here's the checkin:
   http://dev.w3.org/cvsweb/csswg/css3-background/Overview.src.html.diff?r1=1.174&r2=1.175&f=h
Probably easier to read the formatted version, though:
   http://dev.w3.org/csswg/css3-background/#the-border-image-width

I changed border-image-width to reduce all widths proportionally and
added some mathematical notation for it. (I also updated the prose for
border-radius so it matches the math a little better; seems like there
were a few sentences left over from before we had a concrete algorithm.)

I didn't simplify the border-radius formula because I couldn't figure
out a better way to explain it.

> We could also go further, in item 2 (Scale to length) of 5.6 
> (Border-image drawing process), add another bullet:
> 
>    1. Scale to length.
>           *
>             *If the the middle part of the border-image area has zero
>             width, then the top, middle and bottom images are not drawn.*

I think this is unambiguously implied by the relevant maths. :)

> By the way, I was thoroughly confused by the following sentence/formula:
> 
>     *     If X ≠ 0 is the width of the image and W is the width of the
>           padding area, then the rounded width X' = W / ceil(W / X)
> 
> I start reading it as "If X is not equal to zero is the width..." That 
> seems to have two verbs.

It's a subclause. "If X, that is not equal to zero, is the width...".

> Also, I don't think the padding area is 
> relevant to this calculation any more, since the introduction of the 
> whole 'background-image-offset' idea.

That particular paragraph was removed in one of my earlier edits; the
remaining wording doesn't have this problem afaict.
   http://dev.w3.org/csswg/css3-background/#border-image-process
   http://dev.w3.org/csswg/css3-background/#background-size

~fantasai
Received on Saturday, 3 October 2009 07:36:36 GMT

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