将div高度设置为100％

Question

我有四个DIV定位在图像中。 Div1和Div 2以及Div 3放置在Footer Div内。 3个Div的内容是动态的，我不知道他们需要什么样的高度。如何将这3个div高度设置为相同的值？ 我已经尝试了不同的解决方案，比如将top和button设置为0px，如下所述：
Make div 100% height of browser window

这就是我目前所拥有的：

这是我的HTML布局：

<div class="About">
<div class="RightAbout">
</div>
<div class="CenterAbout">
</div>
<div class="LeftAbout">
</div>
</div>

这是我的CSS类：

.About
{    
    padding:0px;
    background-color:#757575;
    border:none;
    min-height:250px;
    color:White;
    font-size:12pt; 
}
.RightAbout
{
    display:inline-block;
    width:290px;
    min-height:100%;
    border-left:solid 1px #CDCDCD;
    margin:0px 0px 0px 0px;
    padding:0px 5px 0px 5px;
    vertical-align:top;
    background-color:blue;
}


.CenterAbout
{
    display:inline-block;
    width:290px;
    min-height:100%;
    border-left:solid 1px #CDCDCD;
    margin:30px 0px 30px 0px;
    padding:0px 5px 0px 5px;
    vertical-align:top;
}
.LeftAbout {
    display: inline-block;
    min-height:100%;
    border: none;
    padding: 0px 5px 0px 5px;
    margin: 30px 0px 30px 0px;
    vertical-align: top;
}

Answer 1

喜欢这个

<强> demo

<强> CSS

body, html {
  height: 100%;
}


.About
{    
    padding:0px;
    background-color:#757575;
    border:none;
    min-height:250px;
    color:White;
    font-size:12pt; 
    display:table;
}
.RightAbout
{
    display:table-cell;
    width:290px;
    min-height:100%;
    border-left:solid 1px #CDCDCD;
    margin:0px 0px 0px 0px;
    padding:0px 5px 0px 5px;
    vertical-align:top;
    background-color:blue;
}


.CenterAbout
{
    display:table-cell;
    width:290px;
    min-height:100%;
    border-left:solid 1px #CDCDCD;

    vertical-align:top;
     background-color:#757575;
}
.LeftAbout {
   display:table-cell;
    min-height:100%;
    border: none;
    width:290px;

    vertical-align: top;
     background-color:#757575;
}

Answer 2

您似乎遇到与此人相同的问题：

How to Force Child Div to 100% of Parent's Div Without Specifying Parent's Height?

这可以解决您的问题并在将来帮助解决类似的问题：

Equal Height Columns with Cross-Browser CSS