Question

选中此FIDDLE

这就像手机原型一样，50px和header-div的固定高度为footer-div。

我希望content-div根据main-container（此处充当移动屏幕尺寸）动态调整其高度。调整内容溢出应该只在可见的content-div高度滚动。

如果我header-div和footer-div身高10%和content-div身高80%。因此它根据屏幕尺寸排列。麻烦的是页眉和页脚高度会因屏幕尺寸而异，因此会使header-div和footer-div的高度更大/更小。

这就是我为header-div和footer-div设置了50px的特定高度的原因。现在我希望调整content-div，使其根据height（父div）动态更改其main-container

感谢任何帮助。感谢。

Answer 1

我尝试了这个，我不确定你是否愿意这样，但这就是我为你所得到的......

将main-container的CSS代码更改为此。

 .main-container {
    width: 420px;
    height: auto;
    background-color: #f7f7f7;
}

Answer 2

更改main-container

的css代码

.main-container {
width: 420px;
height: 1.2em; //change as per your requirements 
background-color: #f7f7f7;

}