title: center text inside html5 date input
body: <p>I cant for the life of me figure out how to center text inside of a html5 date input. As you can see I can change the color of the text but cant center it. i have tried multiple things in css as well</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-css lang-css prettyprint-override"><code>input.element.text{text-align:center;/* dont work here */color:green;line-height: 30px;}/* change color but not align*/
  
  input[type=date]{
  line-height: 46px;
  height: 30px;
  width:300px;
  text-align: center;/* dont work here */
  text-align-last: center;
   color:red;/* used to test */
  }
  
  input[type=text]{ color:blue;/* used to test */
  text-align: center;/* dont work here */
  text-align-last: center;
   
  }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;input type="date" name="dob" class="element" size="" maxlength="15" value="" type="text" placeholder="" required&gt;</code></pre>
  </div>
  </div>
  </p>