JQuery UI日期选取器css看起来很有问题

我在这里使用JQuery UI Datepicker：https://jqueryui.com/datepicker/。这是我实现的样子：JQuery UI日期选取器css看起来很有问题

包括。在我的头：

<!-- JQuery --> 
<script src="http://cdn.jsdelivr.net/webjars/jquery/2.1.4/jquery.min.js"></script> 

<!-- Bootstrap CSS --> 
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/> 

<!-- Include Single Date Picker --> 
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.0/themes/base/jquery-ui.css" /> 
<script src="http://cdn.rawgit.com/jquery/jquery-ui/1.10.4/ui/jquery.ui.datepicker.js"></script> 
<script id="mobile-datepicker" src="http://cdn.rawgit.com/arschmitz/jquery-mobile-datepicker-wrapper/v0.1.1/jquery.mobile.datepicker.js"></script>

HTML。我有两个日期选择了在同一时间：

<!-- Include Single Date Picker --> 
<script src="https://code.jquery.com/jquery-1.12.4.js"></script> 
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script> 

<td><input th:field="*{dateFrom}" style="border-radius: 4px; padding: 11px 11px 11px 11px; width: 100%;" type="text" class="datepicker" /></td> 
<td><input th:field="*{dateTo}" style="border-radius: 4px; padding: 11px 11px 11px 11px; width: 100%;" type="text" class="datepicker" /></td>

的JavaScript。在我的页面的底部：

<!-- Initialize Date Picker --> 
<script type="text/javascript"> 
$(function() { 
    $(".datepicker").datepicker(); 
}); 
</script>

为什么我的日历看起来那么糟糕？

来源

2017-04-20 santafebound

这是一些CSS。你能提供一个jsfiddle吗？我会纠正它。 – Sandwell

@Sandwell我在这里开始了一个：https://jsfiddle.net/#&togetherjs=mmRTK5zow3 – santafebound

看起来你对你的TD具有填充右某处代码，尝试在你的开发工具来检查，看看那里的 .ui-datepicker td {border: 0; padding:1px } 被覆盖

来源

2017-04-20 12:40:40 Daniel

我试过寻找无处不在。甚至无法覆盖该类的填充。必须是某种引导程序/ jquery-ui.css不兼容性... – santafebound

当您右键单击并按下检查您的某个td：s时，您的检查器的外观如何？是.ui-datepicker td {padding：1px}划掉？ – Daniel

问题是，在我的主style.css中，我在每个锚点“a”上都有一个右边距。 jquery-ui css中不会出现的小错误。 – santafebound

JQuery UI日期选取器css看起来很有问题

回答

相关问题