New issue
Advanced search Search tips

Issue 785041 link

Starred by 1 user

Issue metadata

Status: Duplicate
Merged: issue 581545
Owner: ----
Closed: Nov 2017
Cc:
Components:
EstimatedDays: ----
NextAction: ----
OS: ----
Pri: 3
Type: Bug



Sign in to add a comment

<input> in flex container is extra-shrinkable if it has a percent width, for some reason

Project Member Reported by dholb...@gmail.com, Nov 14 2017

Issue description

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 2017

Here 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;
}

Comment 2 by dholb...@gmail.com, Nov 14 2017

Mergedinto: 581545
Status: Duplicate (was: Untriaged)
Actually, looks like I filed this a year ago as
  https://bugs.chromium.org/p/chromium/issues/detail?id=581545

This is a duplicate of that older bug.  Sorry for the bugspam.

Sign in to add a comment