0

Please see this minimum example

<div class="container">
  <input type="text">
  <div></div>
</div>
.container {
  display: flex;

  width: 100px;
  height: 35px;
  border: 1px solid red;

  input {
    flex-grow: 1;
  }

  div {
    min-width: 14px;
    height: 14px;
    border: 1px solid red;
  }
}

And the result

enter image description here

Why is this happening?

Does <input type="text" /> has minimum width or something?

But I can't find it, and explicitly set width went back to normal.

Temani Afif
  • 245,468
  • 26
  • 309
  • 415
Joseph
  • 3,974
  • 7
  • 34
  • 67

0 Answers0