title: Customize input type date
body: <p>I have an input type date, as the image below:</p>
  
  <p><a href="https://i.stack.imgur.com/AejaC.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/AejaC.png" alt="enter image description here"></a></p>
  
  <p>I want to remove it the buttons with the up and down only in summer web, used to change each part of the date.</p>
  
  <p>And also display the entire date, because the text is half off because of the place of buttons.</p>
  
  <p>I am providing a editable code to bottom to facilitate.</p>
  
  <pre><code>&lt;input type="date" id="sender_ad_date" name="sender[ad][date]" required="required" class="date" data-role="date" value="31-12-1969"&gt;
  </code></pre>
  
  <p><a href="http://codepen.io/MarciusMcflay/pen/QyzVvQ" rel="nofollow noreferrer">Pen edit input type date</a></p>
  
  <p>I know it's a simple question, but not to get to do that. please help me.</p>
  
  <p>I have yet to appear the arrow to open the calendar. Nah actually I have to edit the colors of it as well.</p>
  
  <p><strong>UPDATE</strong> </p>
  
  <p>With a help of miguel I could get something with this code, but there's something on the side of the arrow of the calendar, which this escondedo one piece of text.</p>
  
  <pre><code>.date{
    width: 100px;
  }
  
  input[type="date"]::-webkit-inner-spin-button {
    display: none;
  }
  
  input[type="date"]::-webkit-calendar-picker-indicator{
    background: none;
    padding: 0;
  }
  </code></pre>