Search code examples
htmlcssinternet-explorermozilla

Margin displayed differently in IE and Mozilla


Is margin treated differently in IE and Mozilla ? Because when I tried Mozilla 3.6 displaying margin correctly but IE 8 stretching it too far.
Here is my code

<div id="searchCriteria">  
<table width="100%" border="1"  bordercolor="#64A4F5">       
</table>
</div>  
<div id="searchResult">
</div>

Here is my css

#searchCriteria{  
        height:24%;  
        width:100%;  
        float: right;  
        display: block;  
        font-family:  
        verdana,arial;  
        font-size: 12px;
}

#searchResult{  
        height:70%;  
        width:100%;  
        float:right;  
        display:block;  
        margin-top:15px;  
        margin-bottom:5px; 
}

Margin between searchCriteria and searchResult div is getting stretched in IE but working fine in Mozilla.
(It looks like in IE some space is coming between table element and searchCriteria div)


Solution

  • Added height=100% to <table> and it works. Thank you all for your suggestions :)