Safari中的Jquery UI日期选择器黑色背景部分

我正在使用 Contact Form 7 wordpress插件并已启用 fallback for HTML5 input types 因为Safari不支持桌面上的日期输入类型。

联系人表单7附带的jquery ui png图像已损坏,需要我从其他来源替换它们,因为它们无法在Safari上正确显示。

在解决了ui图标的问题后,我仍然在日期选择器上有一个显示为黑色的区域。我已经检查了代码,但无法确定是什么元素、样式或背景图像造成了下面的黑色区域。

小部件的代码如下-

<div id="ui-datepicker-div" class="ui-datepicker ui-widget ui-widget-content ui-helper-clearfix ui-corner-all" style="position: fixed; top: 4px; left: 251px; z-index: 2; display: block;">
   <div class="ui-datepicker-header ui-widget-header ui-helper-clearfix ui-corner-all">
      <a class="ui-datepicker-prev ui-corner-all" data-handler="prev" data-event="click" title="Previous"><span class="ui-icon ui-icon-circle-triangle-w">Previous</span></a><a class="ui-datepicker-next ui-corner-all" data-handler="next" data-event="click" title="Next"><span class="ui-icon ui-icon-circle-triangle-e">Next</span></a>
      <div class="ui-datepicker-title"><span class="ui-datepicker-month">July</span>&nbsp;<span class="ui-datepicker-year">2018</span></div>
   </div>
   <table class="ui-datepicker-calendar">
      <thead>
         <tr>
            <th scope="col"><span title="Monday">M</span></th>
            <th scope="col"><span title="Tuesday">T</span></th>
            <th scope="col"><span title="Wednesday">W</span></th>
            <th scope="col"><span title="Thursday">T</span></th>
            <th scope="col"><span title="Friday">F</span></th>
            <th scope="col" class="ui-datepicker-week-end"><span title="Saturday">S</span></th>
            <th scope="col" class="ui-datepicker-week-end"><span title="Sunday">S</span></th>
         </tr>
      </thead>
      <tbody>
         <tr>
            <td class=" ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled">&nbsp;</td>
            <td class=" ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled">&nbsp;</td>
            <td class=" ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled">&nbsp;</td>
            <td class=" ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled">&nbsp;</td>
            <td class=" ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled">&nbsp;</td>
            <td class=" ui-datepicker-week-end ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled">&nbsp;</td>
            <td class=" ui-datepicker-week-end " data-handler="selectDay" data-event="click" data-month="6" data-year="2018"><a class="ui-state-default" href="#">1</a></td>
         </tr>
         <tr>
            <td class=" " data-handler="selectDay" data-event="click" data-month="6" data-year="2018"><a class="ui-state-default" href="#">2</a></td>
            <td class=" " data-handler="selectDay" data-event="click" data-month="6" data-year="2018"><a class="ui-state-default" href="#">3</a></td>
            <td class=" " data-handler="selectDay" data-event="click" data-month="6" data-year="2018"><a class="ui-state-default" href="#">4</a></td>
            <td class=" " data-handler="selectDay" data-event="click" data-month="6" data-year="2018"><a class="ui-state-default" href="#">5</a></td>
            <td class=" " data-handler="selectDay" data-event="click" data-month="6" data-year="2018"><a class="ui-state-default" href="#">6</a></td>
            <td class=" ui-datepicker-week-end " data-handler="selectDay" data-event="click" data-month="6" data-year="2018"><a class="ui-state-default" href="#">7</a></td>
            <td class=" ui-datepicker-week-end " data-handler="selectDay" data-event="click" data-month="6" data-year="2018"><a class="ui-state-default" href="#">8</a></td>
         </tr>
         <tr>
            <td class=" " data-handler="selectDay" data-event="click" data-month="6" data-year="2018"><a class="ui-state-default" href="#">9</a></td>
            <td class=" " data-handler="selectDay" data-event="click" data-month="6" data-year="2018"><a class="ui-state-default" href="#">10</a></td>
            <td class=" " data-handler="selectDay" data-event="click" data-month="6" data-year="2018"><a class="ui-state-default" href="#">11</a></td>
            <td class=" " data-handler="selectDay" data-event="click" data-month="6" data-year="2018"><a class="ui-state-default" href="#">12</a></td>
            <td class=" " data-handler="selectDay" data-event="click" data-month="6" data-year="2018"><a class="ui-state-default" href="#">13</a></td>
            <td class=" ui-datepicker-week-end " data-handler="selectDay" data-event="click" data-month="6" data-year="2018"><a class="ui-state-default" href="#">14</a></td>
            <td class=" ui-datepicker-week-end " data-handler="selectDay" data-event="click" data-month="6" data-year="2018"><a class="ui-state-default" href="#">15</a></td>
         </tr>
         <tr>
            <td class=" " data-handler="selectDay" data-event="click" data-month="6" data-year="2018"><a class="ui-state-default" href="#">16</a></td>
            <td class=" " data-handler="selectDay" data-event="click" data-month="6" data-year="2018"><a class="ui-state-default" href="#">17</a></td>
            <td class=" " data-handler="selectDay" data-event="click" data-month="6" data-year="2018"><a class="ui-state-default" href="#">18</a></td>
            <td class=" " data-handler="selectDay" data-event="click" data-month="6" data-year="2018"><a class="ui-state-default" href="#">19</a></td>
            <td class=" " data-handler="selectDay" data-event="click" data-month="6" data-year="2018"><a class="ui-state-default" href="#">20</a></td>
            <td class=" ui-datepicker-week-end " data-handler="selectDay" data-event="click" data-month="6" data-year="2018"><a class="ui-state-default" href="#">21</a></td>
            <td class=" ui-datepicker-week-end " data-handler="selectDay" data-event="click" data-month="6" data-year="2018"><a class="ui-state-default" href="#">22</a></td>
         </tr>
         <tr>
            <td class=" " data-handler="selectDay" data-event="click" data-month="6" data-year="2018"><a class="ui-state-default" href="#">23</a></td>
            <td class=" " data-handler="selectDay" data-event="click" data-month="6" data-year="2018"><a class="ui-state-default" href="#">24</a></td>
            <td class=" " data-handler="selectDay" data-event="click" data-month="6" data-year="2018"><a class="ui-state-default" href="#">25</a></td>
            <td class=" " data-handler="selectDay" data-event="click" data-month="6" data-year="2018"><a class="ui-state-default" href="#">26</a></td>
            <td class=" " data-handler="selectDay" data-event="click" data-month="6" data-year="2018"><a class="ui-state-default" href="#">27</a></td>
            <td class=" ui-datepicker-week-end " data-handler="selectDay" data-event="click" data-month="6" data-year="2018"><a class="ui-state-default" href="#">28</a></td>
            <td class=" ui-datepicker-week-end " data-handler="selectDay" data-event="click" data-month="6" data-year="2018"><a class="ui-state-default" href="#">29</a></td>
         </tr>
         <tr>
            <td class=" " data-handler="selectDay" data-event="click" data-month="6" data-year="2018"><a class="ui-state-default" href="#">30</a></td>
            <td class=" " data-handler="selectDay" data-event="click" data-month="6" data-year="2018"><a class="ui-state-default" href="#">31</a></td>
            <td class=" ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled">&nbsp;</td>
            <td class=" ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled">&nbsp;</td>
            <td class=" ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled">&nbsp;</td>
            <td class=" ui-datepicker-week-end ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled">&nbsp;</td>
            <td class=" ui-datepicker-week-end ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled">&nbsp;</td>
         </tr>
      </tbody>
   </table>
</div>

我已经通过Safari的检查员进行了多次跟踪,只是不知道我需要查看哪些元素。