Sayfanın en altında footer yapısı oluşturmak için birçok yöntem bulunmaktadır. Ama bu metodları çoğu bir çok karışık XHTML ekletisi veya javascript yapısı gerektirmektedir. Aşağıda vereceğim kodlar yalnızca 15 satır kodlar bu işi yapabilmekte.
Öncelikle yeni bir XHTML sayfa oluşturun ve CSS yapısına aşağıdaki kodları ekleyin.
* {
margin: 0;
}
html, body {
height: 100%;
}
.wrapper {
min-height: 100%;
height: auto !important;
height: 100%;
margin: 0 auto -4em;
}
.footer, .push {
height: 4em;
}
Aşağıdaki kodları ise XHTML yapısında kullanın. Yalnız push div'nin içine içerik eklemeyin. Zira "push" sınıfını kullanan div'in amacı footer kadar boyutundan dolayı wrapper içeriğinin margin-bottom işlevini görmektedir.
<head>
<link rel="stylesheet" href="layout.css" ... />
</head>
<body>
<div class="wrapper">
<p>Your website content here.</p>
<div class="push"></div>
</div>
<div class="footer">
<p>Copyright (c) 2008</p>
</div>
</body>
Kolay Gelsin.
