Closed Bug 1176723 Opened 4 years ago Closed 4 years ago

nested flexbox sometimes have wrong height for the inner one if the outer has a fixed height

Categories

(Core :: Layout, defect)

38 Branch
defect
Not set

Tracking

()

RESOLVED INVALID

People

(Reporter: starryin, Unassigned)

References

(Blocks 1 open bug, )

Details

(Keywords: testcase)

User Agent: Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/44.0.2403.39 Safari/537.36

Steps to reproduce:

can also see on http://codepen.io/anon/pen/zGEgQE

<!doctype html>
<html>
  <head>
  </head>
  <body>
      <div  style="display:flex;flex-direction:column;height:100px;">
          <div style="flex: 0 0 100%; display:flex;">
            <div style="overflow:auto;flex: 0 0 100%">
              <p>aaaaaaaaaa</p>
              <p>aaaaaaaaaa</p>
              <p>aaaaaaaaaa</p>
              <p>aaaaaaaaaa</p>
              <p>aaaaaaaaaa</p>
              <p>aaaaaaaaaa</p>
              <p>aaaaaaaaaa</p>
              <p>aaaaaaaaaa</p>
              <p>aaaaaaaaaa</p>
            </div>
        </div>
      </div>
  </body>
</html>


Actual results:

inner flexbox have a height of its child box if it has a child,
have a 100% height of its parent if has no children


Expected results:

should have a 100% height of its parent in this case, this worked in latest stable chrome
Component: Untriaged → Layout
Keywords: testcase
Product: Firefox → Core
min-height should be set 0 for flex element, if you want the expected results.

See, https://developer.mozilla.org/en-US/Firefox/Releases/34/Site_Compatibility#CSS

So, I think this should TE bug.
(In reply to Alice0775 White from comment #1)
> min-height should be set 0 for flex element, if you want the expected
> results.
> 
> See,
> https://developer.mozilla.org/en-US/Firefox/Releases/34/
> Site_Compatibility#CSS
> 
> So, I think this should TE bug.

Thank you Alice, so I think chrome didn't follow the spec in this case right? I got this link
https://code.google.com/p/chromium/issues/detail?id=487302
BTW, the computed style for min-height in firefox inspector is still min-height:0px.
Good sleuthing -- it looks like Chrome's behavior is exactly that issue. [adding to "see also" field]

Also: Alice0775 filed bug 1176808 on the inspector "min-height:0px" thing you mentioned, too -- thanks for mentioning that.

Closing this bug here as INVALID, since the reported behavior isn't actually a Firefox bug.
Status: UNCONFIRMED → RESOLVED
Closed: 4 years ago
Resolution: --- → INVALID
You need to log in before you can comment on or make changes to this bug.