Jquery FullCalendar V2事件标题在月视图中被截断

升级到jqueryfullcalendar的V2后，我注意到长标题事件的标题被切断了

我通过添加CSS解决了这个问题，但现在又出现了另一个问题——长标题的事件似乎扩展了整行，导致相邻的日子出现了一个空白，而这些日子都有短标题的事件

添加CSS

.fc-day-grid-event > .fc-content {
white-space: inherit; }

见：

11月13日的两个事件之间有一个空行/高度，这是由11月12日的长事件造成的

---

我不知所措-有人能帮忙吗？

基于jQuery日历的结构，真的没有可能实现您想要的。这是因为事件位于表行中。正如对您的问题的第一条评论所述：

在V2.0.0（我正在使用这个）和V2.2.6（您正在使用的）之间，议程的构建从

divs

移动到

表

。如果您将CSS和JS降级到V2.0.0，您将看到您的问题消失了：jsfiddle.net/uawsdebv/12我认为这与其说是一个答案，不如说是一个解决办法。也许可以修改与标签相关的css，但我在css方面还不够高级，不知道什么是解决方案

---

据我所知，你可能会发现这是解决这个问题的唯一方法。

你的问题没有直接的解决办法。问题在于日历是使用表构造的。

您在这里的意图与表结构的核心操作背道而驰

对于每一行，表行的高度分别是恒定的，如果一行中有不同高度的td，则该行将使其高度适应最大td，该行中较小的td与下一行之间将有空白

---

您可以使用嵌套表解决这个问题，嵌套表基本上使用td中的表。

您可以为每个事件指定最大高度，并使用文本溢出省略号。整个事件标题可以使用title html属性在鼠标上显示。 //css

//jquery

$(".fc-content").each(function(){
  $(this).attr("title",$(this).text());
  })

---

这里是工作链接

，因为日历HTML结构是基于行的，所以不可能像以前那样浮动元素（行高是为行内最高高度的元素设置的）

或者你可以这样做

.fc-day-grid-event > .fc-content {
   white-space: normal;
   text-overflow: ellipsis;
   max-height:20px;
}
.fc-day-grid-event > .fc-content:hover {
   max-height:none!important; 
}

这将默认隐藏标题，当您悬停时，它将完整显示标题

---

下面是它的工作原理

问题似乎取决于

fc content

类中的

空白

属性。 在我的情况下，我已经按如下方式摆脱了它：

---

.fc content{white space:normal}

在V2.0.0（我正在使用此版本）和V2.2.6（您正在使用的版本）之间，议程的构建从

divs

移动到

表

。如果您将CSS和JS降级到V2.0.0，您将看到您的问题消失了：我认为这与其说是一个答案，不如说是一个解决办法。可能可以修改与

标记相关的css，但我在css方面还不够高级，不知道什么是解决方案。事件在单独的表行中。使用此html无法获得所需的布局。最好的办法是缩小字体大小，并将“空白：继承”更改为“文本溢出：省略号”。

.fc-day-grid-event > .fc-content {
   white-space: normal;
   text-overflow: ellipsis;
   max-height:20px;
}
.fc-day-grid-event > .fc-content:hover {
   max-height:none!important; 
}