User Agent: Mozilla/5.0 (Windows NT 6.1; Win64; x64; rv:44.0) Gecko/20100101 Firefox/44.0 Build ID: 20160210153822 Steps to reproduce: 1. Open the demo https://jsfiddle.net/uwbhddxj/9/ 2. Click run Actual results: The viewport is blank, because the <div> element has an effective height of 0. It should be a height of 100px. Expected results: Per the spec, flex elements with flex-basis of "0%", inside elements with an indefinite main-size value (like the demo's <body> element in this case), should behave like a flex-basis value of "auto". This works in Chrome, but not in Firefox. Extended debugging discussion located here: http://chat.stackoverflow.com/transcript/message/29044830#29044830
Component: Untriaged → Untriaged
OS: Windows 7 → All
Product: Firefox → Core
I'm unable to set the Component to Layout, that's not an option for some reason.
Sorry for the long turnaround on a response here. But: I think Firefox is actually correct here now (not sure what the exact state was when this was filed). (In reply to Tyler from comment #0) > Expected results: > > Per the spec, flex elements with flex-basis of "0%", inside elements with an > indefinite main-size value (like the demo's <body> element in this case), > should behave like a flex-basis value of "auto". This isn't quite correct (or it's not correct anymore, if it was correct when this was filed). The spec actually says: > percentage values of flex-basis are resolved against > the flex item’s containing block (i.e. its flex container); > and if that containing block’s size is indefinite, the > used value for flex-basis is 'content' So the used value is 'content' (in this case, the content height of the flex item, as if we had flex-basis:auto;height:auto). And here, the content-height is 0. So: the flex item's 'height:100px' does not come into play when resolving its flex-basis. (It *would* come into play if we had "flex: 1 auto;height:100px". But that's not what we have -- we effectively have "flex: 1 content; height:100px".) Note that we only just implemented support for the 'content' keyword (in Nightly 61), and Chrome still does not support it, so it may be a little confusing to try different examples using explicit 'content' here. But even before we implemented 'content'-the-keyword, we basically implemented the correct behavior for cases where it's implied as the used value, which is why we got this "correct" (violating your expectations) even before we supported 'content'-the-keyword.
Status: NEW → RESOLVED
Last Resolved: 11 months ago
Resolution: --- → INVALID
Here's the spec link for the spec quote in comment 2: https://drafts.csswg.org/css-flexbox/#flex-basis-property
You need to log in before you can comment on or make changes to this bug.