如何在IE7中设置div的最小高度？

Question

我需要设置div的最小高度.在Firefox中,一切都很好,但我在使用IE7时遇到了麻烦 - 这是一个意想不到的大空间.

ul, il {
    list-style: none;
    padding: 0px;
    margin: 0px;
}

    .p_block{   
        color: #336699;
        font-size: 14px;
        min-height: 18px;
    }

<ul>
    <li><a href="#"><div class="p_block">text</div></a></li>
    <li><a href="#"><div class="p_block">text</div></a></li>
    <li><a href="#"><div class="p_block">text</div></a></li>
    <li><a href="#"><div class="p_block">text</div></a></li>
</ul>

奇怪的是,如果我删除padding: 0px;的ul, li,一切工作正常.为什么？

Answer 1

@Chinmayee,该解决方案的问题在于firefox和其他几个元素的高度将无法超过18px.

最小高度的跨浏览器解决方案:

{
height: auto !important;
height: 200px;
min-height: 200px;
}

基本上;
第1行:大多数现代浏览器都理解!重要,因此不会覆盖下一行的属性.

第2行:因为旧浏览器不知道!重要,它必须是设定的高度.较旧的浏览器将允许元素增长,除非有溢出:属性集.

第3行:现代浏览器理解min-和!important.所以现代浏览器理解高度:自动和最小高度:200px,而旧版浏览器理解高度:200px; 但会让元素增长;)

Answer 2

将此 CSS 用于 IE 和 FF

  .p_block{   
        color: #336699;
        font-size: 14px;
        min-height: 18px;
        height:18px !important;
    }