Today i was trying to code a fixed footer . It took very small time to code. And that works ok in FireFox but when i open that page in Internet Explorer it looks different . Here is the first code .

body {
margin:0px;
padding:0 0 0 0 ;
}
#footer{
height:50px;
width:100%;
position:fixed;
top:95%;
background:#efefef;
border:1px solid #ccc;
}

#main {
height:1200px;
background:#A8C5FF;
}

<div id=”main”></div>

<div id=”c” align=”center”>

<div id=”footer”>Its Fixed !</div>

</div>

Then i try to fix this problem . The code below works in IE and the FF fine .

body{
margin:0;
padding:0 0 50px 0;
}
div#footer{
position:absolute;
bottom:0;
left:0;
width:100%;
height:30px;
}
#chat{
background:#efefef;
border-top:1px solid #ccc;
border-left:1px solid #ccc;
border-right:1px solid #ccc;
width:800px;
height:100%;
padding:0px;
margin:0px;
}
@media screen{
body>div#footer{
position:fixed;
}
}
* html body{
overflow:hidden;
}
* html div#content{
height:100%;
overflow:auto;
}


<div id="footer" align="center">

<div id="chat">

Content can be placed here......

</div>

</div>

<div id="content">

<span style="height:1300px"></span>

</div>


Nice hun ?