Fix MS Edge and Firefox issues #342, #388

src/components/input/input.scss

@@ -19,6 +19,12 @@ $md-input-underline-focused-color: md-color($md-primary);
 $md-input-underline-disabled-background-image: linear-gradient(to right,
         rgba(0,0,0,0.26) 0%, rgba(0,0,0,0.26) 33%, transparent 0%);
 
+/**
+ * Removes firefox box-shadow on required fields...
+ */
+:-moz-ui-invalid {
+    box-shadow: none;
+}
 
 /**
  * Applies a floating placeholder above the input itself.
@@ -33,6 +39,15 @@ $md-input-underline-disabled-background-image: linear-gradient(to right,
   }
 }
 
+/**
+ * Applies a floating placeholder above the input before chrome's and safari's auto-fill commits.
+ * Firefox has selector issues for :-webkit-autofill, thats why this mixin is duplicated and is used seperately below 
+ */
+%md-input-placeholder-floating-autofill {
+  visibility: visible;
+  padding-bottom: 5px;
+  transform: translateY(-100%) scale(0.75);
+}
 
 :host {
   display: inline-block;
@@ -143,7 +158,7 @@ $md-input-underline-disabled-background-image: linear-gradient(to right,
   // Once the autofill is committed, a change event happen and the regular md-input
   // classes take over to fulfill this behaviour.
   input:-webkit-autofill + .md-input-placeholder {
-    @extend %md-input-placeholder-floating;
+    @extend %md-input-placeholder-floating-autofill;
   }
 
   // The underline is what's shown under the input, its prefix and its suffix.

src/components/input/input.ts

@@ -134,7 +134,7 @@ export class MdInput implements ControlValueAccessor, AfterContentInit, OnChange
   @Input() @BooleanFieldValue() floatingPlaceholder: boolean = true;
   @Input() hintLabel: string = '';
   @Input() id: string = `md-input-${nextUniqueId++}`;
-  @Input() maxLength: number = -1;
+  @Input() maxLength: number = null;
   @Input() placeholder: string;
   @Input() @BooleanFieldValue() required: boolean = false;
   @Input() @BooleanFieldValue() spellcheck: boolean = false;