Re: [css4-background] use cases for 'border-corner-shape'?

On Mar 25, 2013, at 00:18, L. David Baron wrote:

> On Sunday 2013-03-24 23:14 +0200, Lea Verou wrote:
>> Googling these is pretty hard, as everybody uses different names to refer to them. Nevertheless, here are a few tutorials and questions from struggling authors about how to replicate these effects:
>> 
>> bevel
>> --------
>> http://stackoverflow.com/questions/6474168/how-do-i-make-corners-angled-like-this-using-css
> 
> Not achievable using the proposal because of the way the shadow
> lines up.
It is, if you use an inset shadow, which is clipped by the outer shape.

> 
>> http://stackoverflow.com/questions/10349867/how-do-i-bevel-the-corners-of-an-element
> 
> No site or image (other than a link to your demo/tutorial, which
> isn't a use case).
That reply is marked as correct and got a comment of "Yes!!! Thank you!" from the asker, so it's pretty obvious what he needed.

> 
>> http://stackoverflow.com/questions/14093619/make-cut-off-corners-with-a-border
> 
> No site or image.
There is both an image and a fiddle to demonstrate what he wants to do.

> 
>> http://stackoverflow.com/questions/8854457/css-only-cross-browser-clipped-corners
> 
> This has only sample code, not a real-site context, so it's not
> possible to tell if the feature would serve the real use case.
It also has a link that points to an example of the effect he is trying to do.

> 
>> http://stackoverflow.com/questions/9300692/how-to-make-a-rounded-corner-rectangle-with-a-cut-corner-using-css
> 
> Not achievable using the proposed feature because the line is not at
> a 45 degree angle.
border-corner-shape works with border-radius and gets the angle from there. It’s entirely possible, with a smaller vertical radii than the horizontal one.

> 
>> http://stackoverflow.com/questions/2767150/how-to-give-transparent-hexagon-angle-at-the-last-li-only
> 
>> http://stackoverflow.com/questions/8986545/css3-one-of-the-div-corners-should-inwards
> 
> Same as previous (not 45 degree angle).
Same as previous reply. border-corner-shape: bevel; does not only create 45 degree angles.

> 
>> http://stackoverflow.com/questions/7059597/slanted-corner-on-css-box
> 
> This is a demo rather than a site showing enough context.
A demo of the effect he is trying to accomplish...

> 
>> http://stackoverflow.com/questions/14418309/clipping-or-chamfering-corners-of-image-to-see-background
> 
> Again, no site context.
> 
>> http://stackoverflow.com/questions/7324722/cut-corners-using-css
> 
> Same.
> 
>> http://stackoverflow.com/questions/13545192/create-border-with-two-cut-off-corners
> 
> Same.
> 
>> http://stackoverflow.com/questions/10196072/css-border-shape-how-to-cut-off-rectangle-right-upper-corner
> 
> Same.
> 
>> http://stackoverflow.com/questions/11791947/styling-a-box-shadowed-element-with-cutoff
> 
> Image can't be done using the proposed feature.
It drastically simplifies it though. With border-corner-shape it would only need a small rectangular background image (which could be a gradient or a pseudo-element). Without it, it’s much harder to do.

> 
>> http://stackoverflow.com/questions/15148421/div-background-shadow-to-fit-custom-css-shape
> 
> I can't actually see the shadow well enough to tell what shadow
> behavior is intended and whether it's what would result from the
> proposed feature.
> 
> 
> etc.  etc.
> 
> 
> To be clear:  when we added border-radius, it was pretty easy to
> find sites simulating rounded borders using images (typically a grid
> of images in tables).
> 
> If we want to add similar features, it should be equally easy to
> find such sites.  Otherwise we should just tell authors who want
> effects like these to use border-image (possibly with SVG).
So anything that is not as common as rounded corners isn’t worthy of being added? I can think of several examples to the contrary. Sure, rounded corners are the most commonly needed type. But that doesn’t mean other types aren’t common. If anything, elliptical corners are far more rare than any of these effects, and yet, they’re in.

Received on Sunday, 24 March 2013 22:31:48 UTC