- From: Shashi Gowda <shashigowda91@gmail.com>
- Date: Fri, 23 Jan 2015 11:33:26 +0530
- To: www-style@w3.org
- Message-ID: <CAKs8bqk0S2XHRN-01jD0Q9ttNBy_o7s-yREwSTdrbwx6XPCmUA@mail.gmail.com>
I have this markup: <div style="display: inline-flex; flex-direction: row;"> <div style="width: 100px; flex: 1 1 0; height: 100px; background-color: gray;"></div> <div style="width: 150px; flex: 1 1 0; height: 150px; background-color: black;"></div> </div> The two inner boxes appear one after the other, their width are distributed and they sum up to the sum of their original width. They overflow if the container's width is not sufficient. (Also notice that the flex-basis of the boxes is 0.) But now if I set the flex-direction to column, the two boxes disappear. I then need to set the height of the containing div to be able to see them. I think these two outcomes are inconsistent. A more obvious behavior would be that the flex container collapses to 0 width (if width is not set) in the flex-direction: row case. Another alternative is that the sum of the natural heights of the inner boxes can be distributed in the flex-direction: column case, similar to how the natural width gets distributed in the row case. Do correct me if I am missing something... Regards
Received on Friday, 23 January 2015 09:08:18 UTC