html - CSS min-height 不保持 div 内联

Question

我将此 CSS 代码与媒体查询一起使用：

.clearfloat {
    clear: both;
    font-size: 1px;
    height: 0;
    line-height: 0;
}
.box-container {
    width:100%;
    text-align:center;
}
.icon-box {
    width:32%;
    max-width:500px;
    display:inline-block;
    border:1px solid #CCC;
    margin-top:10px;
    margin-bottom:10px;
}

@media screen and (max-width: 990px) {
    .icon-box {
        width:290px;
    }
}
@media screen and (max-width: 960px) {
    .icon-box {
        width:270px;
    }
}

@media screen and (max-width: 880px) {
    .clearfloat {
        display:none;
    }
    .icon-box {
        width:80%;
        margin:0 auto 0 auto;
        margin-top:10px;
        margin-bottom:10px;
    }
}

我想为每个盒子设置一个最小高度，但是当我添加它时，盒子不会内联显示

这是一个完整的 CSS 和 HTML 代码的小提琴：http: //jsfiddle.net/aAtk5/1/

Answer 1

将 min-height 设置为.icon-box似乎工作正常。 http://jsfiddle.net/aAtk5/5/

.icon-box {
    min-height:50px;
    ...
    ...
}