I have a site with the following structure:
<div id="header"></div>
<div id="main">
<div id="navigation"></div>
<div id="content"></div>
</div>
<div id="footer"></div>
The navigation is on the left and the content div is on the right. The information for the content div is pulled in through PHP, so it's different every time.
How can I scale the navigation vertically so that its height is the same as the content div's height, no matter which page is loaded?
Best Answer
For the parent:
You should add some prefixes, http://css-tricks.com/using-flexbox/.
As @Adam Garner noted, align-items: stretch; is not needed. Its usage is also for parent, not children. If you want to define children stretching, you use align-self.