Weebly Fancybox/Lightbox移动端问题：关闭按钮被遮挡、图片位置偏上

关闭按钮被图片遮挡修复 #

该问题由关闭按钮层级低于图片容器导致，直接在Weebly后台自定义CSS区域（通常位于「设计-自定义CSS」或「设置-SEO-头部代码」）添加如下样式即可：

/* 提升关闭按钮层级，确保显示在最上层 */
.fancybox-close {
    z-index: 99999 !important;
}

如果使用的是Fancybox 3/4版本，替换对应类名即可：

.fancybox__button--close {
    z-index: 99999 !important;
}

移动端图片偏上不居中修复 #

该问题由默认移动端垂直间距规则适配异常导致，添加如下响应式CSS即可实现垂直居中：

@media only screen and (max-width: 768px) {
    /* Fancybox 2版本适配 */
    .fancybox-inner {
        display: flex !important;
        align-items: center !important;
        min-height: 85vh !important;
    }
    .fancybox-image {
        max-height: 80vh !important;
        margin: 0 auto !important;
    }

    /* Fancybox 3/4版本适配，不需要可删除 */
    .fancybox__content {
        align-self: center !important;
    }
}

内容的提问来源于stack exchange，提问作者Nelly