I have a navigation menu where I want a fixed height and for the sub-menus to wrap vertically so I end up with columns of menus. Trying flex column, the wrapping works, but the parent ul does not enlarge to fit the children horizontally. Instead, the child menus just overflow the parent width. See here:
https://jsfiddle.net/6wpg5oqr/
#parent { display:flex; flex-flow:column wrap; background-color:red; height:100px;}#parent > * { min-width:0;}<ul id='parent'><li><ul><li> aaaaaaaaaaa</li><li> aaaaaaaaaaa</li><li> aaaaaaaaaaa</li>// ...</ul></li></ul>Why is this happening? I've seen it suggested to use min-width:0 on the children, but as you can see that didn't do anything.