diff --git a/application/views/layout/footer.php b/application/views/layout/footer.php
index 92a8d60f..4972f3ed 100644
--- a/application/views/layout/footer.php
+++ b/application/views/layout/footer.php
@@ -1,6 +1,7 @@
+</div> <!-- end wrapper -->
 	<div id="footer">
 	<a href="http://www.cloudlog.co.uk">Powered by Cloudlog</a>
 	</div>
 </body>
 
-</html>
\ No newline at end of file
+</html>
diff --git a/application/views/layout/header.php b/application/views/layout/header.php
index d2e0fc56..6f19d877 100644
--- a/application/views/layout/header.php
+++ b/application/views/layout/header.php
@@ -17,6 +17,13 @@
 	<link rel="stylesheet" href="<?php echo base_url();?>css/bootcamp/bootstrap.css" type="text/css" />
 	<link rel="stylesheet" href="<?php echo base_url();?>css/main.css" type="text/css" />
 	
+	<!-- Sticky Footer IE -->
+	<!--[if !IE 7]>
+	<style type="text/css">
+		#wrap {display:table;height:100%}
+	</style>
+	<![endif]-->
+	
 	<!-- Theming Code Goes Here -->
 	
 	<!-- Icons -->
@@ -117,3 +124,4 @@
     </div>
 
 <div id="clear" class="clear"></div>
+<div id="wrap">
diff --git a/css/main.css b/css/main.css
index 881c7ffe..cf5f4b59 100644
--- a/css/main.css
+++ b/css/main.css
@@ -1,6 +1,13 @@
+html, body {height: 100%;}
+
+#wrap {min-height: 100%;}
+
+#main {overflow:auto; padding-bottom: 3em; /* must be same height as the footer */ }  
+	
 #container { padding-top: 50px; width: 940px; margin: 0 auto; }
 
-#footer { width: 940px; margin: 0 auto; text-align: right; }
+#footer { width: 940px; margin: -3em auto; text-align: right; position: relative; clear:both; height: 3em;
+/* margin-top must be the negative value of footer height */ }
 
 table .titles { font-weight: bold; color: #439BF6; }
 table .title { font-weight: bold; color: #439BF6; }