Glad I could help! Thanks for testing in Firefox & for reaching out. On Dec 29, 2016 4:55 PM, "Valera Rozuvan" <[email protected]> wrote:
> Daniel! Thank you for clearing this up to me. You are truly a magician. > Happy new year = ) > > On Friday, December 30, 2016 at 2:45:12 AM UTC+2, Daniel Holbert wrote: > > Edge's rendering matches Firefox, BTW (you probably want to test Edge > > rather than IE, for modern standards-compliance at least). > > > > The issue is with the magic "min-height:auto" / "min-width:auto" > > behavior in modern Flexbox. You've got two nested instances of this > > pattern: > > <flex container> > > <small header> > > <greedy content area> > > ...and in each instance, the "greedy content area" has a huge minimum > > intrinsic height, which means it absorbs all of the container's free > > space up-front and forces the other flex item (<small-header) to shrink > > to its min-height (which happens to be 0). > > > > You can work around this behavior by giving the greedy thing > > "min-height:0", to explicitly give it permission to shrink below its > > minimum intrinsic height. In this case, you need to do that for .app > > and .contbody. > > > > Here's an updated version of your page with that fixed: > > https://output.jsbin.com/gugeduxoxi/ > > This works in both Firefox and Edge. > > > > ~Daniel > > > > P.S. I think Chrome's behavior here is buggy, and probably an instance > > of https://bugs.chromium.org/p/chromium/issues/detail?id=487302#c8 > _______________________________________________ > dev-tech-layout mailing list > [email protected] > https://lists.mozilla.org/listinfo/dev-tech-layout > _______________________________________________ dev-tech-layout mailing list [email protected] https://lists.mozilla.org/listinfo/dev-tech-layout
