make title overflow

src/styles/app.styl

@@ -166,22 +166,30 @@ ul
 
 #title
   border-bottom: 3px solid #F3F4F8
+  white-space: nowrap
+  line-height: 52px // outer height of tallest element
+  margin-top: 20px
 
   .title
-    white-space: nowrap
+    float: left
     border-bottom: 3px solid #AAAFBF
-    margin: 30px 0 -3px 0
-    padding-bottom: 20px
+    margin-bottom: -3px
 
   .sub
-    white-space: nowrap
+    float: left
     font-size: 16px
     font-weight: bold
-    margin: 0 20px
+    padding: 0 20px
 
   .description
+    overflow: hidden
     font-family: $serif_font
     color: #B1B6C4
+  
+  &:after
+    display: block
+    clear: both
+    content: ""
 
 #page
   padding-bottom: 80px // height of the footer

src/templates/pages/milestone.html

@@ -2,13 +2,9 @@
   <div intro="fade">
     <div id="title">
       <div class="wrap">
-        <table>
-          <tr>
-            <td><h2 class="title">{{ format.title(milestone.title) }}</h2></td>
-            <td><span class="sub">{{{ format.due(milestone.due_on) }}}</span></td>
-            <td><div class="description">{{{ format.markdown(milestone.description) }}}</div></td>
-          </tr>
-        </table>
+        <h2 class="title">{{ format.title(milestone.title) }}</h2>
+        <span class="sub">{{{ format.due(milestone.due_on) }}}</span>
+        <div class="description">{{{ format.markdown(milestone.description) }}}</div>
       </div>
     </div>