anova · October 12, 2013 09:15
diff --git a/footer-at-bottom.html b/footer-at-bottom.html
 <!doctype html>
 <html lang="en">
 <head>
  <meta charset="UTF-8">
 	<title>Footer at bottom</title>
 	<style>
 		html,
 		body {
 			margin: 0;
 		}
 		
 		.row {
 			clear: both;
 			float: left;
 			width: 100%;
 		}
 		
 		.header,
 		.content,
 		.footer {
 			
 		}
 		
 		.header,
 		.footer {
 			background-color: #dedede;
 		}
 		
 		
 		html,
 		body {
 			height: 100%;
 		}
 		
 		.header,
 		.footer,
 		.footer-ghost {
 			height: 150px;
 		}
 		
 		.wrapper {
 			min-height: 100%;
 			height: auto !important;
 			height: 100%;
 			margin-bottom: -150px; //değeri footer yüksekliği kadar veriyoruz
 		}
 	</style>
 </head>
 <body>
 	<div class="row wrapper">
 		<div class="row header"></div>
 		<div class="row content">
 			<p>
 				<span>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Animi maiores modi impedit laboriosam a non excepturi voluptas aperiam doloribus nulla quos ullam neque. Ab distinctio architecto quos laboriosam et fugiat?</span>
 				<span>Aliquam atque veniam vero cupiditate cumque dignissimos molestiae libero eos esse fuga aperiam maiores enim quam placeat natus deleniti nostrum commodi minus quis minima soluta debitis incidunt id recusandae ipsum!</span>
 				<span>Facere consequatur eum ex molestias enim minus vero itaque asperiores eius at! Rem dolorum temporibus aut tenetur quo in animi magnam explicabo velit neque aliquam voluptatum molestiae voluptatibus quis quae.</span>
 			</p>
 			<p>
 				<span>Lorem ipsum dolor sit amet, consectetur adipisicing elit. At veniam minus quisquam consequatur laborum magnam totam eius distinctio facere error repellendus atque reiciendis explicabo sint tenetur impedit itaque est assumenda.</span>
 				<span>Explicabo minima cupiditate odit est sunt? Doloremque animi iste quasi optio ad facilis accusamus cupiditate et facere vel minima quod in nihil debitis adipisci iure consectetur eum deserunt. Exercitationem at!</span>
 				<span>Provident unde libero aliquam eveniet placeat dolor sit fugiat corporis. Facere vitae deleniti voluptates adipisci facilis non alias et fugiat minima quis dolores soluta similique deserunt repellendus quisquam! Voluptatum accusamus.</span>
 			</p>
 			<p>
 				<span>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Maxime similique dolore corporis dolorem incidunt labore modi non temporibus accusamus blanditiis earum libero eius officiis. Assumenda delectus incidunt et magnam officia.</span>
 				<span>Repudiandae quibusdam officiis expedita iste est veniam libero deleniti id voluptas debitis ut enim atque blanditiis aliquam nam eum quae. Repellendus debitis quisquam sunt perspiciatis sapiente consectetur error reiciendis explicabo.</span>
 				<span>Molestiae ducimus eaque et ut ex voluptates illo quo distinctio labore cupiditate laborum magnam excepturi aperiam. Maiores nesciunt labore consectetur atque a enim in nostrum soluta nulla beatae nobis incidunt.</span>
 			</p>
 			<p>
 				<span>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Similique est quia nisi sed quidem sequi earum tempora incidunt rem odit id iste facilis reprehenderit recusandae natus ipsum fuga libero. Cumque.</span>
 				<span>Repellat molestiae inventore quo possimus voluptatem adipisci ab tenetur sit numquam officiis natus nobis. Suscipit sunt atque explicabo velit fugit placeat quasi doloremque magni at eaque obcaecati assumenda corporis ab.</span>
 				<span>Iusto dicta doloremque maiores voluptate quaerat tempore nostrum delectus. Consequuntur tenetur libero optio animi dolorem a enim aliquid sint neque laudantium necessitatibus sunt voluptates itaque quasi obcaecati labore nostrum placeat?</span>
 			</p>
 			<p>
 				<span>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Harum temporibus sapiente cum odio culpa necessitatibus deserunt sint ullam nemo voluptates. Tempora maiores hic excepturi nam sapiente doloribus accusamus minima quos!</span>
 				<span>Sit quasi voluptate modi dolor cum repellat vero dicta culpa! At temporibus dolore tempore distinctio quasi sunt id voluptatum eveniet cupiditate beatae laborum suscipit ex delectus earum nisi eos saepe.</span>
 				<span>Deleniti placeat iure saepe autem magnam dolorem eum asperiores illo alias sequi quod animi dolor assumenda quibusdam culpa similique rem! Iure dignissimos ab ratione tempora ipsam officia rerum neque possimus.</span>
 			</p>
 		</div>
 		
 		<div class="row footer-ghost"></div>
 	</div>
 	<div class="row footer"></div>
 </body>
 </html>
No results found