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 .
<!-- IE in quirks mode --> 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 ?
