場景： 元素分為左右兩塊，左邊元素定寬，右邊元素自動充滿屏幕。

flex布局中設置寬度被壓縮的問題

當子元素設置固定寬度，如果整體寬度不足時，會把固定寬度給壓縮，解決方法: 給固定寬度的元素添加flex-shrink:0。

flex-shrink
指定了 flex 元素的收縮規(guī)則。

設置flex屬性時子元素寬度超出父元素

設置右邊元素flex：1，當右邊元素寬度超過父元素時，會造成右邊寬度溢出。

解決方案：給右側設置了flex:1;的元素，同時設置width:0

.right {
    width: 0;
    flex: 1;
}