1377201 - min-content sizing doesn't seem to account for padding-right on inline-level descendant

Status: NEW

(Core :: Layout, defect, P3)

Description

[Daniel Holbert [:dholbert]]

Attachment: testcase 1

STR:
 1. Load attached testcase.

EXPECTED RESULTS:
Nothing should be protruding from the black bordered boxes. They are min-content sized, which means they should be wide enough so that its contents shouldn't need to overflow.

ACTUAL RESULTS:
The second one (the orange one) overflows from its black bordered container.  (This one has "padding-right" on a descendant.)

Comment 1

[Daniel Holbert [:dholbert]]

Chrome 55 and Safari 10.1 seem to get this wrong, too, though they're different from our flavor of wrong.

They render the first bordered box too skinny for its content (whereas we seem to get that one right).  And they just don't render any color at all for the padding on the orange element (the second bordered box), though they do set aside space for it.

Comment 2

[Daniel Holbert [:dholbert]]

Attachment: testcase 2 (using flexbox)

Here's a similar testcase that just uses a flexbox to trigger min-content sizing, rather than using the explicit -[vendor]-min-content keywords.

(Flexbox shrinks its items down to their min-content sizes if there's not enough space for all of its items to fit, as long as their "flex-shrink" and "min-width" [or min-height] properties are at default values.)

Comment 3

[Daniel Holbert [:dholbert]]

Edge 15 seems to get this correct, at first glance at least.  Ignore them for testcase 1, because they don't support min-content sizing keywords AFAICT -- but on testcase 2, Edge's rendering has the following nice behaviors:
 - The space that's been reserved for padding is all colored in correctly. (unlike Chrome)
 - There's no overflow. (unlike Chrome)
 - There's no linewrapping. (unlike Firefox)

Comment 4

[Ksenia Berezina [:ksenia]]

The linked webcompat issue https://webcompat.com/issues/6405 is now fixed, unsetting the webcompat priority.