Question

I need to set the minimum height of a div. In Firefox everything is good, but I’m having trouble with IE7 – an unintended big space.

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>

Strangely, if I delete padding: 0px; from ul, li, everything works fine. Why?

Answer 1

use this CSS for IE & FF

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