Chrome Version: Version 64.0.3260.2 (Official Build) dev (64-bit)
OS: Ubuntu 16.04
What steps will reproduce the problem?
(1) Visit https://jsfiddle.net/9ga1gmL3/
What is the expected result?
The textfields should be the same width (both 100px wide, both overflowing their flex container).
What happens instead?
The second one (whose width is specified with a percent) is smaller. It shrinks to fit its flex container. There's no reason why it should shrink when the first one does not.
For comparison, Firefox and Edge give the expected result.
Comment 1 by dholb...@gmail.com
, Nov 14 2017Here is the content of the jsfiddle, BTW. HTML: The textfields below should be the same width. <br><br> Input with width:100px: <div class="flex"> <div class="spacer"></div> <input style="width:100px"> </div> Input with width:100%: <div class="flex"> <div class="spacer"></div> <input style="width: 100%"> </div> CSS: .flex { width: 100px; display: flex; border: 2px solid black; } .spacer { flex: 0 0 60px; background: gray; }