###### tags: `css` `Flex-Box`
# FlexBox
## Flex會自動根據內容物延伸高度，所以有時候圖片會變形跟著拉長？
範例：

解決方法：
1.在img加入`align-self: start;`,針對flex裡的物件在交錯軸線的位置。
2.在img加入 `height: 100%;`

正確畫面：

參考：
[Why does flexbox stretch my image rather than retaining aspect ratio?](https://stackoverflow.com/questions/37609642/why-does-flexbox-stretch-my-image-rather-than-retaining-aspect-ratio)
[align-self 屬性介紹](https://w3c.hexschool.com/flexbox/c3847835)