title: md-datepicker shows scrollbar on the side on Edge and IE 11
body: <p>I am using the standard md-datepicker on my page. Its working fine on all browsers but on IE11 and Edge, theres a weird scrollbar displayed on the right. </p>
  
  <p>Please find the screenshot below. </p>
  
  <p>Here is my code: </p>
  
  <p>HTML:
  </p>
  
  <pre><code>&lt;div id="myDatepicker" layout="column" ng-cloak&gt;
    &lt;md-content&gt;
      &lt;md-datepicker 
        ng-model = "myDate" 
        md-placeholder = "Enter date" md-hide-icons="triangle"&gt;
      &lt;/md-datepicker&gt;
    &lt;/md-content&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>JS:
  </p>
  
  <pre><code>$scope.myDate = "";
  this.isOpen = false;
  </code></pre>
  
  <p>CSS:
  </p>
  
  <pre><code>.md-default-theme .md-datepicker-input-container, .md-datepicker-input-container {
    border-bottom-color: white;
  }
  
  .md-default-theme .md-datepicker-input, .md-datepicker-input {
    color: #1797c0;
  }
  
  #myDatepicker .md-datepicker-calendar-icon {
    color: #1797c0;
  }
  </code></pre>
  
  <p>Also there's an orange line underneath the placeholder which I have tried changing to white in the CSS above - not sure why its not being applied? </p>
  
  <p>Link - <a href="https://i.stack.imgur.com/7JbfO.png" rel="nofollow noreferrer">IE 11 - scrollbar on the right of datepicker </a></p>
  
  <p>Link - <a href="https://i.stack.imgur.com/sXyWb.png" rel="nofollow noreferrer">Edge - scrollbar on the right of datepicker</a></p>