浮浮，唐不要忘記父元素應該清除浮動。

在最近的一次面試中，面試官問，在水平布局中，假設有三個div，每個都有固定的寬度apx。如果想讓兩邊的寬度都是x，那么中間div的間隔就是2x。x可以是自適應的。

怎么做很簡單，就兩行代碼:

justify-content的常見屬性有:flex-start|flex-end|center|space-between|space-around。

前三個按字面意義對齊到行首、行尾和行中間。

在最后兩個示例中，space-between:元素將均勻分布在行中。如果最左邊的剩余空格為負，或者該行只有一個子元素，則該值等效于#39flex-start#39。在其他情況下，第一個元素的邊界與該行的主起始位置的邊界對齊，而最后一個元素的邊界與該行的主結束位置的邊距對齊，而剩余的擴展框項均勻分布，并確保它們之間的空白空間相等。白話的意思是第一個元素的位置與該行的起始位置對齊，最后一個元素與該行的結束位置對齊，中間剩余的空間均勻分布。

Space-around:彈性盒元素將在行中均勻分布，兩端將在子元素之間保留一半的空間。如果最左邊的剩余空間為負，或者該行中只有一個擴展框項目，則該值等效于#39center#39。其他情況下，擴展框項均勻分布，保證每對之間的空格相等，第一個元素前的空格和最后一個元素后的空格是其他空格的一半。

說到這個，it都是廢話，這也是你最初學習flexlayout會接觸到的。主要是面試官問，如果中間不是2x，那就是x，也就是每個缺口和兩邊的區間一樣。那個it::

起初，我想在兩邊設置填充，并在中間使用空格，但在不同屏幕上看到的兩邊的填充值肯定是不同的，所以我不我不想等待雙方的差距。。。所以我沒有Idon'我最后也想不通。回來后發現justify-content居然還有space-even這樣的屬性！為什么使用這個屬性是不言而喻的。均勻排列各元素，各元素之間的間隔相等。問題解決了。然而，空間均勻的兼容性仍然比通常使用的justify-content值差得多。

我們可以不要只是見面解決面試。問題，實際情況中可能會出現很多奇妙的情況，比如，四個x上圖中的s改為三個xs和one2x(雖然我沒見過這么奇妙的設計。。)那么我該怎么辦呢？

這里我想到了css3的cacl()，可以計算百分比和px值，而且是強批。例如，要達到上述要求:

也能取得成果。(假設a的值是100px)并且無論什么情況都可以計算出你想要的大小。It這不太好。