[css-ui-3] box-sizing: padding-box

At the NY F2F, we discussed the future of box-sizing: padding-box, and pending confirmation from Mozilla after checking how it's being used internally, there was agreement that this should probably be dropped from the spec, removed from Firefox, and not implemented in other browsers.

I haven't heard from Mozilla yet, but I have seen signs of end end-users asking for the feature. Not many of them, but not zero either.

Here is a request for Microsoft Edge to support it:
https://wpdev.uservoice.com/forums/257854-microsoft-edge-developer/suggestions/6517061-padding-box

Here's one in chromium's bug tracker:
https://code.google.com/p/chromium/issues/detail?id=245536

Here's one in webkit's bug tracker:
https://bugs.webkit.org/show_bug.cgi?id=23658

Asking for use cases, here's an answer I got.

> There are times where borders could be decorative elements where it is more optimal for it to be excluded from the width. I’ve put together a small demo here. On hover, a border-right is appearing on the <div>s on the left side. If border-box had been used, the border would have become inside the element, shrinking the dark green width, but on Firefox it is rendering outside as intended. If I had been using content-box, I would’ve had to shrink the div widths as a hack instead of the more easy «width: 100%».
> 
> http://jsbin.com/cepifuyuru/1/edit?html,css,output


If Mozilla is going to drop this and nobody else wants to implement, keeping it in the spec would be fiction, which doesn't really help anyone.

However, the feature makes conceptual sense, has use cases (even if they're relatively rare), and I don't think it has significant implementation difficulties beyond what you need to do to handle the box-sizing property at all.

Do browser vendors really think this is useless / worth dropping?

 - Florian

Received on Friday, 12 June 2015 12:34:53 UTC