W3C home > Mailing lists > Public > public-css-archive@w3.org > July 2018

Re: [csswg-drafts] [css-backgrounds-4] Extruding border corners (negative border-radius)

From: Nigel Megitt via GitHub <sysbot+gh@w3.org>
Date: Thu, 26 Jul 2018 15:35:56 +0000
To: public-css-archive@w3.org
Message-ID: <issue_comment.created-408138955-1532619347-sysbot+gh@w3.org>
@fantasai I agree, there are two things to think about here:

1. The general model for background areas and how they interact with layout
2. The specific computation for this use case.

#### General model

Thinking about the general model first, I think a way that _could_ work here is:

1. Background constraints are pre-applied prior to layout (`*`)
2. Layout generates foreground content
3. Background is computed based on locations of boxes generated by layout
4. Background layer is inserted at appropriate z-index
5. Layers are drawn in order from lowest z-order to highest z-order

`*` In step 1 I am referring to things like line padding, that affect the available space for layout. For example, if line padding is specified as 10px at the beginning and end of every line, then we can subtract 2*10 = 20px from the available inline size prior to layout, and offset the alignment basis point by 10px in the appropriate direction (or 0px if `centre`), then do layout, and then in step 3 we can safely create a background box that is 10px bigger than the line box at either end.

In step 3, since the background instructions are all known, if there is additional "clever" stuff to do like setting corner rounding and corner rounding axes, or combining areas into complex polygons, then the information should be available to allow that to happen, and cannot affect foreground layout.

#### Specific computation for this case

I'm not sure the best mathematical approach to take but it seems to be known art, in that there are drawing tools (for example) that can combine multiple rectangles into complex polygons and apply vertex effects. 


-- 
GitHub Notification of comment by nigelmegitt
Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/2811#issuecomment-408138955 using your GitHub account
Received on Thursday, 26 July 2018 15:36:04 UTC

This archive was generated by hypermail 2.3.1 : Thursday, 26 July 2018 15:36:08 UTC