javascript - 创建可调整大小的日历 (html/css/jquery)

Question

<分区>

Answer 1

您正在将元素的所有位置属性设置为“绝对”。当您将某物设置为“position:absolute”时，它会将其绝对定位在设置为“position:relative”的最近父级中。它还从一般文档流中删除元素。上边距发生的情况是，由于日历不在文档流中，它会与它上面的控件重叠。您应该从 CSS 中删除位置属性。

这是您在 html 页面本身中应该具有的日历样式:

    div#calendar {
    margin-left: 252px !important;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

我在 style 属性中包含了 div 元素，因为它赋予了规则更大的权重。我还将“margin-left”属性的值设置为 important，因为在 fullcalendar.css 文件中将另一种样式设置为 important。这两个一起将覆盖该文件中应用的左边距。

我目前只能在 safari 中对此进行测试，但它应该可以在大多数浏览器中正常工作。如果这有帮助，请告诉我。