title: Trying to put an image inside my datepicker input
body: <p>Im using datepicker to select a date and it is already working fine.</p>
  
  <p>I also have buttonImage option to open datepicker on image click.</p>
  
  <p>The problem is, that I want to put my calendar image inside my input floated at left, but I dont see how I can do this.</p>
  
  <p>This is my input:</p>
  
  <pre><code>&lt;input type="text" class="datepicker" id="formDate" /&gt;
  </code></pre>
  
  <p>Here I start my datepicker with some configurations:</p>
  
  <pre><code>$(function(){
      $('.datepicker').datepicker({   
          showOn: "both",
          buttonImage: 'img/calendar.png',
          buttonImageOnly: true
       });
      $('.ui-datepicker-trigger').css({padding: '7px' ,  float:'left', cursor:'pointer', background:'gray' });
  });
  </code></pre>
  
  <p>Im trying to have my image inside my input, but Im not having sucess doing this.</p>
  
  <p>I tried with margins, floats, giving to my image position absolute and to my input position relative and nothing is working..</p>
  
  <p>Im getting always this result:</p>
  
  <p><img src="https://i.stack.imgur.com/GmaAD.png" alt="enter image description here"></p>
  
  <p>Do you see some way to put my calendar image inside my input at left?</p>