Get the tooltip working in FF

* master:
  Slider: resolve jshint issue
  Simulate larger hitbox on slider element (fixes #281)
  Fix footer in Firefox (fixes #279)

src/footer/_mega_footer.scss

@@ -24,22 +24,11 @@
 }
 
 
-.mdl-mega-footer--top-section:after, .mdl-mega-footer--middle-section:after {
+.mdl-mega-footer--top-section:after,
+.mdl-mega-footer--middle-section:after,
+.mdl-mega-footer--bottom-section:after {
   content: '';
-
   display: block;
-  
-// Optional: top and middle borders for the footer
-// 
-//  width: 100%;
-//  height: 1px;
-//
-//  margin-bottom: $padding;
-//
-//  border-color: $footer-underline-color;
-//  border-bottom-width: 1px;
-//  border-bottom-style: solid;
-
   clear: both;
 }
 
@@ -212,6 +201,11 @@
   padding: 0;
 
   margin-bottom: $padding * 2;
+  &:after {
+    clear: both;
+    display: block;
+    content: '';
+  }
 }
 
 .mdl-mega-footer--link-list li {
@@ -222,6 +216,7 @@
 .mdl-mega-footer--link-list a {
   color: inherit;
   text-decoration: none;
+  white-space: nowrap;
 }
 
 @media screen and (min-width: 760px) {
@@ -247,13 +242,6 @@
   margin-bottom: $padding;
 }
 
-.mdl-mega-footer--bottom-section:after {
-  content: '';
-
-  display: block;
-  clear: both;
-}
-
 .mdl-logo {
   line-height: 20px;
   margin-bottom: $padding;

src/footer/_mini_footer.scss

@@ -57,6 +57,7 @@
   & a {
     color: inherit;
     text-decoration: none;
+    white-space: nowrap;
   }
 }
 

src/slider/slider.js

@@ -89,6 +89,35 @@ MaterialSlider.prototype.onMouseUp_ = function(event) {
   event.target.blur();
 };
 
+/**
+ * Handle mousedown on container element.
+ * This handler is purpose is to not require the use to click
+ * exactly on the 2px slider element, as FireFox seems to be very
+ * strict about this.
+ * @param {Event} event The event that fired.
+ * @private
+ */
+MaterialSlider.prototype.onContainerMouseDown_ = function(event) {
+  'use strict';
+
+  // If this click is not on the parent element (but rather some child)
+  // ignore. It may still bubble up.
+  if(event.target !== this.element_.parentElement) {
+    return;
+  }
+
+  // Discard the original event and create a new event that
+  // is on the slider element.
+  event.preventDefault();
+  var newEvent = new MouseEvent('mousedown', {
+    target: event.target,
+    buttons: event.buttons,
+    clientX: event.clientX,
+    clientY: this.element_.getBoundingClientRect().y
+  });
+  this.element_.dispatchEvent(newEvent);
+};
+
 /**
  * Handle updating of values.
  * @param {Event} event The event that fired.
@@ -190,6 +219,7 @@ MaterialSlider.prototype.init = function() {
     this.element_.addEventListener('input', this.onInput_.bind(this));
     this.element_.addEventListener('change', this.onChange_.bind(this));
     this.element_.addEventListener('mouseup', this.onMouseUp_.bind(this));
+    this.element_.parentElement.addEventListener('mousedown', this.onContainerMouseDown_.bind(this));
 
     this.updateValueStyles_();
     this.element_.classList.add(this.CssClasses_.IS_UPGRADED);