CSS Sticky Footer Layout
It Sticks to the Bottom of the Page!
See that footer, way down there? It's stuck to the bottom of the page even when thin on content. Otherwise it would be floating halfway up the page.
Cross Browser Support for Sticky Footer Code
This sticky footer solution is working in all major browsers, including Chrome and IE 8! It works in HTML5 and with floated 2-column layouts and we don't get overlap in resized browser windows unlike older solutions you find when you Google sticky footer. You don't need an empty push div or cleafix hack. Here is how to use this sticky footer code.
* {margin:0;padding:0;}
/* must declare 0 margins on everything, also for main layout components use padding, not
vertical margins (top and bottom) to add spacing, else those margins get added to total height
and your footer gets pushed down a bit more, creating vertical scroll bars in the browser */
html, body {height: 100%;}
#wrap {min-height: 100%;}
#main {overflow:auto;
padding-bottom: 180px;} /* must be same height as the footer */
#footer {position: relative;
margin-top: -180px; /* negative value of footer height */
height: 180px;
clear:both;}
/*Opera Fix*/
body:before {/* thanks to Maleika (Kohoutec)*/
content:"";
height:100%;
float:left;
width:0;
margin-top:-32767px;/* thank you Erik J - negate effect of float*/
}
/* IMPORTANT
You also need to include this conditional style in the <head> of your HTML file to feed this style to IE 6 and lower and 8 and higher.
<!--[if !IE 7]>
<style type="text/css">
#wrap {display:table;height:100%}
</style>
<![endif]-->
*/
BUDDY CHECK OUT THESE ALSO : ALL LEARNING THING , HTML , CSS , WEB FORMS ,DREAM WEAVER, DTD , JAVA, JAVA SCRIPT , SQL , MY SQL , PL-SQL , PHOTOSHOP , C + + , C , WEB PAGES , MAYA, PDF FILES , EVERYTHING AVAILABLE , AJAX , HYBERNATE , WSDL , WAP , RUBY ON RAILS , SCALA , HTTP , HTML 5 , PROTOTYPE , Wi-MAX , FLASH , WML , RUBY , PERL ,UNIX , DLL , RSS , RADIUS , UNIX SOCKET , PYTHON , JSP , SOAP , MVC , DOT NET , PHP , ADO , ASP , J QUERY , TCP/IP , VISUAL BASIC , UML , VISUAL STUDIO , GPRS....
No comments:
Post a Comment