[csswg-drafts] [CSS-backgrounds-4] Add border-divide property to specify which border fills the corner.

Meteor0id has just created a new issue for https://github.com/w3c/csswg-drafts:

== [CSS-backgrounds-4] Add border-divide property to specify which border fills the corner. ==
[https://drafts.csswg.org/css-backgrounds-4/#borders](https://drafts.csswg.org/css-backgrounds-4/#borders)
When using borders with different colors on a box, it is immediately apparent the borders divide the corners evenly. This is however not always desired. I see no way change this with current existing properties, nor with the properties already in De working drafts. Therefore I suggest adding a rather simple property to do so.
Let's call it: "border-divide", which specifies how the corners are divided between the borders.

The way I initially imagine this would work is by setting it like such:

border-divide: even left left right;
/* defining corners in clockwise order starting at top left: top left, top right, bottom right, bottom left */
resulting in:
<img width="190" alt="css-border-divide-ellr" src="https://user-images.githubusercontent.com/34976212/40368657-96cea21a-5ddc-11e8-85f5-131514dc485e.png">

border-divide: left left left left;
resulting in:
<img width="190" alt="css-border-divide-rrrr" src="https://user-images.githubusercontent.com/34976212/40368659-96f448da-5ddc-11e8-9f6b-0fa246634924.png">

If a border-divide is not defined, assume "even", which is default. This property is not inhearited.

Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/2694 using your GitHub account

Received on Tuesday, 22 May 2018 14:29:35 UTC