I'm having troubles with a flexbox column in that children of the flex'd element don't respond to height in percentages. I've only checked this in Chrome, and from what I understand it's a Chrome only problem. Here's my example:
.flexbox { position: absolute; background: black; width: 100%; height: 100%; display: flex; flex-direction: column;}.flex { background: blue; flex: 1;}.flex-child { background: red; height: 100%; width: 100%; display: block;}.static { background: green; width: 100%; height: 5rem;}<div class='flexbox'><div class='flex'><div class='flex-child'></div></div><div class='static'></div></div>I want it so the red .flex-child fills the blue .flex. Why doesn't height:100% work?