diff --git a/_includes/footer.html b/_includes/footer.html
index 976fb56..fd56281 100644
--- a/_includes/footer.html
+++ b/_includes/footer.html
@@ -1,4 +1,4 @@
-      <footer class="site-footer cf">
+      <footer class="site-footer clearfix">
         <nav>
           <a href="/about/">About</a>
           <a href="/terms-of-service/">Terms of Service</a>
diff --git a/_includes/license-overview.html b/_includes/license-overview.html
index 6b6c835..f563fde 100644
--- a/_includes/license-overview.html
+++ b/_includes/license-overview.html
@@ -1,4 +1,4 @@
-<div class="license-family cf">
+<div class="license-family clearfix">
   <div class="license-family-heading">
     <h3 class="license-family-name"><a href="{{ page.permalink }}">{% if page.category %}{{ page.category }}{% else %}{{ page.title }}{% endif %}</a></h3>
 
diff --git a/_layouts/license.html b/_layouts/license.html
index 602c1c8..5e6ef3d 100644
--- a/_layouts/license.html
+++ b/_layouts/license.html
@@ -1,16 +1,16 @@
 {% include header.html %}
 
-      <div class="cf">
+      <div class="clearfix">
         <div class="license-body">
           <pre id="license-text">
 
 {{ content | replace:"<","[" | replace:">","]" }}
 
-          </pre><!-- /license-text -->
-        </div><!-- /license-body -->
+          </pre> <!-- /license-text -->
+        </div> <!-- /license-body -->
 
 {% include sidebar.html %}
 
-      </div><!-- /cf -->
+      </div> <!-- /clearfix -->
 
 {% include footer.html %}
diff --git a/css/application.css b/css/application.css
index f3d6dac..fa6d8ae 100644
--- a/css/application.css
+++ b/css/application.css
@@ -459,18 +459,18 @@ strong {
 }
 
 /* For modern browsers */
-.cf:before,
-.cf:after {
+.clearfix:before,
+.clearfix:after {
     content: "";
     display: table;
 }
 
-.cf:after {
+.clearfix:after {
     clear: both;
 }
 
 /* For IE 6/7 (trigger hasLayout) */
-.cf {
+.clearfix {
     zoom:1;
 }
 
diff --git a/index.html b/index.html
index 21797e4..6cbcc7d 100644
--- a/index.html
+++ b/index.html
@@ -11,7 +11,7 @@ description: A site to provide non-judgmental guidance on choosing a license for
   Which of the following best describes your situation?
   <span>}</span>
 </h2>
-<ul class="triptych situations cf">
+<ul class="triptych situations clearfix">
   <li class="whatever">
     <a href="licenses/mit">
       <img src="images/three-arrows@2x.png" alt="three arrows" width="72" height="57">
@@ -54,7 +54,7 @@ description: A site to provide non-judgmental guidance on choosing a license for
   What if none of these work for me?
   <span>}</span>
 </h2>
-<ul class="triptych see-more cf">
+<ul class="triptych see-more clearfix">
   <li>
     <h3>My content isn't code.</h3>
     <p>