min-height在安卓下不起作用

正常情况下，min-height可以当height使用

 如：

<div class="father">
　　<div class="child"></div>
</div>

 

style样式为：

.father{
    min-height: 200px;
    font-weight:bold;">#000;
}
.child{
    min-height: 50px;
    font-weight:bold;">red;
}

　　效果是这样的。

当子元素超过父元素的高后，父元素会自动加宽

 

    .father{
            min-height: 200px;
            background-color: #000;
        }
     .child{
           min-height: 250px;
           width: 300px;
           background-color: red;
      }

 

但是当父元素被

display：table后，min-height就会失效了，也就是不能当height使用了，注意：在安卓上失效，在ios上依然是正常的

这里就不截图了。

怎么解决呢？

就是我们在设置min-height同时，把父元素的height也给设置成min-height的值，
min-heigh的值有一个特性，就是当子元素的高度超过min-heght的值时，他会把子元素的高度值复制给自己。这里就会覆盖掉我们之前设置的height值