Misaligned Calendar icon

HTML

<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.11.0/themes/redmond/jquery-ui.css">
<link rel="stylesheet" href="http://cdnjs.cloudflare.com/ajax/libs/jqgrid/4.6.0/css/ui.jqgrid.css">
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.11.0/jquery-ui.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/jqgrid/4.6.0/js/i18n/grid.locale-en.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/jqgrid/4.6.0/js/jquery.jqGrid.src.js"></script>
<table id="pays_grid"></table>
<div id="pays_grid_pager"></div>

CSS

.ui-jqgrid .ui-search-table .ui-search-input > input, .ui-jqgrid .ui-search-table .ui-search-input > select, .ui-jqgrid .ui-search-table .ui-search-input > img {
    vertical-align: middle;
    display: inline-block;
}

JavaScript

var mydata = [{
    Sel: false,
    Country: "Germany",
    Capital: "Berlin",
    Date: "05-09-2014"
}, {
    Sel: false,
    Country: "France",
    Capital: "Paris",
    Date: "05-09-2014"
}, {
    Sel: false,
    Country: "Cameroon",
    Capital: "Yaounde",
    Date: "06-09-2014"
}, {
    Sel: false,
    Country: "Gabon",
    Capital: "Libreville",
    Date: "06-09-2014"
}, {
    Sel: false,
    Country: "Holland",
    Capital: "Amsterdam",
    Date: "07-09-2014"
}, {
    Sel: false,
    Country: "Japan",
    Capital: "Tokyo",
    Date: "08-09-2014"
}, {
    Sel: false,
    Country: "Italy",
    Capital: "Rome",
    Date: "09-09-2014"
}, {
    Sel: false,
    Country: "Spain",
    Capital: "Madrid",
    Date: "09-09-2014"
}, {
    Sel: false,
    Country: "England",
    Capital: "London",
    Date: "10-09-2014"
}, {
    Sel: false,
    Country: "US",
    Capital: "Washington D.C.",
    Date: "12-09-2014"
}],
    grid = jQuery("#pays_grid"),
    initDateWithButton = function (elem) {
        if (/^\d+%$/.test(elem.style.width)) {
            // remove % from the searching toolbar
            //elem.style.width = '';
            $(elem).css({
                width: "230px"
            });
        }
        // to be able to use 'showOn' option of datepicker in advance searching dialog
        // or in the editing we have to use setTimeout
        setTimeout(function () {
            $(elem).datepicker({
                dateFormat: 'dd-mm-yy',
                showOn: 'button',
                changeYear: true,
                changeMonth: true,
                buttonImageOnly: true,
                buttonImage: "http://jqueryui.com/resources/demos/datepicker/images/calendar.gif",
                buttonText: "Select date",
                onSelect: function (dateText, inst) {
                    if (inst.id.substr(0, 3) === "gs_") {
                        grid[0].triggerToolbar();
                    } else {
                        // to refresh the filter
      ...