title: Customize Zoom in/out button in leaflet.js
body: <p>I am trying to customize zoom control (+/-), so it should appear in the right side like Google maps (<a href="https://www.google.com/maps/">https://www.google.com/maps/</a>)</p>
  
  <p>I tried to add <code>float:right;</code> but it didn't work.</p>
  
  <p>From the CSS file : </p>
  
  <pre class="lang-css prettyprint-override"><code>/* zoom control */
  
  .leaflet-control-zoom-in,
  .leaflet-control-zoom-out {
    font: bold 18px 'Lucida Console', Monaco, monospace;
    text-indent: 1px;
    }
  .leaflet-control-zoom-out {
    font-size: 20px;
    }
  
  .leaflet-touch .leaflet-control-zoom-in {
    font-size: 22px;
    }
  .leaflet-touch .leaflet-control-zoom-out {
    font-size: 24px;
    }
  </code></pre>
  
  <p><a href="http://jsfiddle.net/hsy7v/1/">http://jsfiddle.net/hsy7v/1/</a></p>