0

I'm learning how to use flexbox and I've been reading quite a bit before trying it on my own.

I have a current issue with vertical scroll and flexbox that is very similar to this issue :

Flexbox and vertical scroll in a full-height app using NEWER flexbox api

But for a reason that I cannot figure out at the moment, the more my scrollable element expands, the bigger the total flexbox element is, which shouldn't be the case.

Here is my example : https://jsfiddle.net/Munsta0/8afLpp0h/4/

#contentContainer {
  background-color: red;
  flex: 1 1 auto; //Rest of space
  overflow-y: scroll

  display: flex;
  overflow: auto;
}

#content{
  min-height: -webkit-min-content;
  display: flex;
  flex-flow: column;
}

How can I prevent the whole thing to expand while I have an overflow-y: scroll?

Edit: I can confirm that this bug is only since chrome 48

Community
  • 1
  • 1
Munsta0
  • 121
  • 1
  • 7
  • So you want the red section to remain a fixed size? I'm not seeing a second scrollbar in Chrome or FF. – Michael Benjamin Feb 02 '16 at 19:23
  • Using chrome latest version I see a double scrollbar on two different computer, I even tried incognito to make sure it wasn't something funky with an extension. I'm confused as to why you can't see it. – Munsta0 Feb 02 '16 at 20:54
  • Try this maybe. It's a Firefox bug, but I've seen some comments lately saying it applies to newest Chrome, as well: http://stackoverflow.com/a/34982902/3597276 – Michael Benjamin Feb 02 '16 at 21:24
  • It didn't solve it. On the other hand, my home pc was still with chrome 47 so I loaded up the fiddle and it was okay. Updated to 48 and now double bar. Well I guess I found the root of my problem at least – Munsta0 Feb 03 '16 at 00:40
  • Yeah, there seems to be a Chrome 48 issue growing. It's apparently breaking a lot of production layouts. I updated my other answer with a couple of bug reports. http://stackoverflow.com/a/34982902/3597276 – Michael Benjamin Feb 03 '16 at 12:30

0 Answers0