jquery datepicker图标拉伸

Question

我似乎无法解决jquery datepicker图标被拉伸的问题，它看起来像这样：

API

当原始图标为17x17像素时，如下所示：

我通过input元素在代码中附加此图像，如下所示：

<input type="text" name="searchDate" id="searchDate" class="datePickerWithImage" cth:inputvalidate="Date" size="10" maxlength="10" tabIndex="14" title="Provide value for search date" />

datepicker的jquery函数是：

$( ".datePickerWithImage" ).datepicker({
    showOn: "button",
    showButtonPanel: true,
    buttonImage: "/images/manageschedule.png",
    dateFormat: 'yy/mm/dd',
    buttonText: "Open calendar",
    buttonImageOnly: true,
    showWeek: true,
});

它在css中有一些额外的渲染提示：

.ui-datepicker-trigger {
                       margin-left:2px;
                       }

我似乎无法在jquery api中找到任何有用的东西，它看起来很奇怪，我真的想解决它：）

编辑：在开发人员工具中，我可以看到元素为<div id="ui-datepicker-div" class="ui-datepicker ui-widget ui-widget-content ui-helper-clearfix ui-corner-all" style="position: absolute; top: 127.909px; left: 471.349px; z-index: 2; display: none;"> ..但不确定它真的有用......

Answer 1

在你的风格中添加这个可以帮到你

input[type="text"].datePickerWithImage
{
width:17px;
height:17px;
}