我现在已经连续两天坚持这个问题，并且竭尽全力尝试各种可能性。所以我简化了下面的jsfiddle示例。基本上我试图在IE 10中使用stretch，它失败了。当＃左侧面板伸展时，#wrapper不会伸展。我需要这两个div（＃left-panel＆amp; #wrapper）始终保持相同的高度。
任何建议都会对我有所帮助，我将非常感激！
更新<！/强>
添加了IE的前缀（但仍无效）
body {
margin: 0;
padding: 0;
height: 100%;
}
#page-wrapper {
background: tomato;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: start;
-ms-flex-pack: start;
justify-content: flex-start;
-webkit-box-align: stretch;
-ms-flex-align: stretch;
align-items: stretch;
height: 100%;
}
#left-panel {
background: skyblue;
width: 250px;
height:2000px;
}
#wrapper {
background: aquamarine;
-webkit-box-flex: 1;
-ms-flex: 1;
flex: 1;
}
#header {
height: 60px;
background: lightblue;
}
#footer {
height: 40px;
background: lightgreen;
}<body>
<div id="page-wrapper">
<div id="left-panel">
panel should expand vertically
</div>
<div id="wrapper">
<div id="header">
Header should expand horizontally
</div>
<div id="main">
content should expand vertically and horizontally
</div>
<div id="footer">
Footer should expand horizontally
</div>
</div>
</div>
</body>
