Flex 佈局裏 input 寬度最小 150px 的問題， 瀏覽器 BUG?

今天在使用 flex 佈局時， 發現當 flex 佈局容器比小（小於 150px ）時，裏面的 input[text] 的寬度會比容器寬：

<style> 
#main
{
	width:120px;
	height:30px;
	border:1px solid black;
	display:flex;
	padding: 5px;
}


</style>


<div id="main">
  <input type="text" style="flex-grow:1;float:left" />
	<button>OK</button>
</div>

　　

通過測試， 發麪 flex 容器下面的 input 最小寬度是 150px, 設置 min-width， display, float 都沒有用， 寬度就是有 150px, 若是給 input 設置一個固定寬度, 那又不能自適應容器的大小。

各類測試發現都不行， 最後把 input 的 width 設置爲 0， 居然就能夠了， 這究竟是哪一種意思？

 

<input type="text" style="width:0;flex-grow:1" />