1116813 - Element containing white-space: nowrap disobeys flexbox sizing

Status: RESOLVED INVALID

(Core :: Layout, defect)

Description

[AJ Foster]

I believe this is a regression since 34.0b1 (it does not exist in 33.1.1).

This bug affects the layout of an element whose parent has display: flex; and who has a child with text contents and white-space: nowrap; overflow: hidden;

Prior to 34.0b1, the element would obey the width dictated by flexbox (i.e. it would shrink appropriately according to the container and siblings). Beginning with 34.0b1, the element does not shrink according to the flexbox rules and instead assumes a width dictated by the child with white-space: nowrap.

Place where this was first noticed: http://codepen.io/aj-foster/pen/emBYPW

The release where this first occurs is 34.0b1, and it exists in the current aurora release (at the time of writing, 36.0a2).

Comment 1

[Daniel Holbert [:dholbert] (PTO until 2/24)]

This is the correct behavior, and it's due to the introduction of special "min-width:auto" behavior on flex items. (basically, preventing them from shrinking below their minimum intrinsic size, or to the specified "min-width" or "width" or "max-width", if any of those are smaller).

Comment 2

[Daniel Holbert [:dholbert] (PTO until 2/24)]

See bug 1043520 (and other bugs that [like this one] are marked as blocking it), for more info.

Comment 3

[Daniel Holbert [:dholbert] (PTO until 2/24)]

Attachment: testcase (with fix applied via ":hover" rule)

For archival purposes, here's the testcase from stackoverflow. I've added the fix, in a ":hover" rule, so you can hover the right area (e.g. over the text "UPPER") and see the fixed rendering.

Comment 4

[Daniel Holbert [:dholbert] (PTO until 2/24)]

Sorry, disregard comment 3; I posted on the wrong bug. (That was intended for bug 1118142.)