日历在Chrome中无法正确呈现

Question

我的网页使用FullCalendar jQuery plugin来显示每月活动日历。如果事件发生在同一天，当在Firefox或IE中查看日历时，它们之间会留下很小的空间，如下面的屏幕截图所示：

另一方面，如果在Chrome中查看同一页面，则会在这些事件之间显示大量（不需要的）空间：

如何在Chrome中查看该页面时消除此空白区域？

更新

我从应用程序中删除了所有引导程序样式，问题不再出现，所以我猜有一些bootrap CSS规则仅应用于Chrome中日历的呈现。现在我只需要弄清楚哪条规则......

Answer 1

固定

奇怪的是，布局问题是由这个CSS规则引起的

    a {
        -webkit-transition: all 0.15s ease-out 0s !important;
        -moz-transition: all 0.15s ease-out 0s !important;
        -o-transition: all 0.15s ease-out 0s !important;
        transition: all 0.15s ease-out 0s !important;
    }

我把它改为：

    a {
        -webkit-transition: none !important;
        -moz-transition: none !important;
        -o-transition: none !important;
        transition: none !important;
    }

问题已解决

Answer 2

有一件事是肯定的，它在某种程度上涉及为包装top元素设置内联a定位的代码。 Firefox和Chrome都将第一个元素设置为top: 52px，但第二个元素的位置不同，Firefox将其设置为top: 95px，将Chrome设置为top: 137px。

这种最大的定位差异可能是因为height嵌套在div内的div与fc-day-content类的height差异。 div的{​​{1}}在Chrome中为170px，在Firefox中为65px。现在，有问题的项目实际上覆盖在fc-day-content结构上，它们不是它的直接子项。但显然代码必须以某种方式读取该结构的高度，以计算将项目放置在与它们重叠的“日期”相关的位置。因此，Chrome中div内fc-day-content的较高高度可能会影响它（反之，a的位置会影响height fc-day-content嵌套）。

我还没有找到放置这些项目位置的代码。

Answer 3

该插件计算日历事件的位置错误。 我建议在load event而不是ready初始化日历。 所以替换

$(document).ready(function() {.....

部分

$(window).load(function() {.....

并查看是否有任何进展。

其他反馈将有助于研究，BR。

Answer 4

你应该尝试使用相对定位：对于像这样的元素

position: relative;
width: 195px;
margin-top: 30px;
float: left;