From a0aaa222a66b2587ac68c4c6fcee4c6b0f3453bf Mon Sep 17 00:00:00 2001
From: Kevin Ingersoll <kingersoll@gmail.com>
Date: Fri, 3 May 2013 15:22:27 +1200
Subject: [PATCH] Use padding instead of #push with box-sizing: border-box

---
 sticky-footer-navbar.html | 7 ++-----
 sticky-footer.html        | 7 ++-----
 2 files changed, 4 insertions(+), 10 deletions(-)

diff --git a/sticky-footer-navbar.html b/sticky-footer-navbar.html
index 429b74f918..fe6681ef69 100644
--- a/sticky-footer-navbar.html
+++ b/sticky-footer-navbar.html
@@ -22,14 +22,13 @@ title: Sticky footer with navbar template
     height: 100%;
     /* Negative indent footer by its height */
     margin: 0 auto -60px;
+    /* Pad bottom by footer height */
+    padding: 0 0 60px;
   }
 
   /* Set the fixed height of the footer here */
-  #push,
   #footer {
     height: 60px;
-  }
-  #footer {
     background-color: #f5f5f5;
   }
 
@@ -106,8 +105,6 @@ title: Sticky footer with navbar template
     <p class="lead">Pin a fixed-height footer to the bottom of the viewport in desktop browsers with this custom HTML and CSS. A fixed navbar has been added within <code>#wrap</code> with <code>padding-top: 60px;</code> on the <code>.container</code>.</p>
     <p>Back to <a href="../sticky-footer">the default sticky footer</a> minus the navbar.</p>
   </div>
-
-  <div id="push"></div>
 </div>
 
 <div id="footer">
diff --git a/sticky-footer.html b/sticky-footer.html
index 62c1088123..14fc1edebe 100644
--- a/sticky-footer.html
+++ b/sticky-footer.html
@@ -22,14 +22,13 @@ title: Sticky footer template
     height: 100%;
     /* Negative indent footer by its height */
     margin: 0 auto -60px;
+    /* Pad bottom by footer height */
+    padding: 0 0 60px;
   }
 
   /* Set the fixed height of the footer here */
-  #push,
   #footer {
     height: 60px;
-  }
-  #footer {
     background-color: #f5f5f5;
   }
 
@@ -71,8 +70,6 @@ title: Sticky footer template
     <p class="lead">Pin a fixed-height footer to the bottom of the viewport in desktop browsers with this custom HTML and CSS.</p>
     <p>Use <a href="../sticky-footer-navbar">the sticky footer with a fixed navbar</a> if need be, too.</p>
   </div>
-
-  <div id="push"></div>
 </div>
 
 <div id="footer">