CSS Flex爲何適合太空奇怪？

Question

我把3個div放入div中，並顯示：flex，希望它能適合真實內容量的所有空間。

.flex { 
    display: flex; 
    padding: 10px; 
} 

活爲例是在這裏：http://plnkr.co/edit/rX3ykWgyTH65uIDHpIS1?p=preview

但在Chrome中似乎結果並不像我想（就像在上表）：

。

這是正常的嗎？如果那是爲什麼？

Answer 1

該問題是由您應用於您的flex項目（選擇器.pod > div）的margin:auto 10px;造成的。

或者更確切地說，它是由垂直margin:auto引起的 - 這是重寫flex的拉伸效果。

更改保證金爲margin:10px，它會工作。