Craft CMS 5.x版本在Safari浏览器中的截图模态框显示问题解析
2025-06-25 03:12:58作者：何将鹤
在Craft CMS 5.5.7版本中，开发者在使用Safari浏览器访问插件商店时发现了一个界面显示问题。当用户点击查看插件截图时，弹出的模态框(modal)无法正常显示，这影响了用户体验。
问题现象
具体表现为三个主要问题：
- 模态框无法填满整个浏览器视窗
- 截图内容需要大幅滚动才能看到
- 轮播指示器出现在页面底部，需要滚动才能操作
技术原因分析
经过开发者调查，发现问题根源在于CSS的container-type属性。这个属性创建了一个新的布局约束容器，阻止了position: fixed定位的元素突破容器边界。虽然根据相关技术社区的讨论，这个问题在其他浏览器中已经得到修复，但Safari浏览器在这方面似乎存在滞后。
解决方案
开发团队通过将#screenshot-modal元素从.ps-wrapper容器中移出，直接放置在<body>标签内，成功解决了这个问题。这种调整确保了模态框能够正确突破容器约束，在Safari中正常显示。
版本更新
Craft CMS团队在5.5.8版本中已经包含了这个修复。建议所有使用5.x版本的用户，特别是需要在Safari浏览器中访问插件商店的管理员，尽快升级到最新版本以获得最佳体验。
这个案例也提醒我们，在跨浏览器开发时，需要特别注意CSS容器属性和定位方式的兼容性问题，特别是在Safari这类可能对最新标准支持滞后的浏览器中。
登录后查看全文
相关内容推荐
热门项目推荐
atomcodeClaude Code 的开源替代方案。连接任意大模型，编辑代码，运行命令，自动验证 — 全自动执行。用 Rust 构建，极致性能。 ｜ An open-source alternative to Claude Code. Connect any LLM, edit code, run commands, and verify changes — autonomously. Built in Rust for speed. Get StartedRust0218
cann-learning-hubCANN 学习中心仓，支持在线互动运行、边学边练，提供教程、示例与优化方案，一站式助力昇腾开发者快速上手。Jupyter Notebook0140
uni-appA cross-platform framework using Vue.jsJavaScript09
GLM-5.2智谱开源 GLM-5.2，这是针对长文本任务的最新旗舰模型。相较于前代产品 GLM-5.1，它在长文本任务处理能力上实现了显著飞跃，并且首次在稳定的 100 万 token 上下文中提供这一能力。Jinja00
SwanLab⚡️SwanLab - an open-source, modern-design AI training tracking and visualization tool. Supports Cloud / Self-hosted use. Integrated with PyTorch / Transformers / LLaMA Factory / veRL/ Swift / Ultralytics / MMEngine / Keras etc.Python00
tiny-universe《大模型白盒子构建指南》：一个全手搓的Tiny-UniverseJupyter Notebook03
热门内容推荐
最新内容推荐
项目优选
收起
kernelopenEuler内核是openEuler操作系统的核心，既是系统性能与稳定性的基石，也是连接处理器、设备与服务的桥梁。
C
471
466
kerneldeepin linux kernel
C
32
16
atomcodeClaude Code 的开源替代方案。连接任意大模型，编辑代码，运行命令，自动验证 — 全自动执行。用 Rust 构建，极致性能。 ｜ An open-source alternative to Claude Code. Connect any LLM, edit code, run commands, and verify changes — autonomously. Built in Rust for speed.
Get Started
Rust
2.09 K
218
ops-nn本项目是CANN提供的神经网络类计算算子库，实现网络在NPU上加速计算。
C++
700
1.4 K
docs暂无描述
Dockerfile
780
5.08 K
pytorchAscend Extension for PyTorch
Python
758
968
flutter_flutter本仓库是 Flutter SDK 与 Flutter Engine 的 OpenHarmony 适配版本，由 CPF-Flutter 团队维护。开发者可使用熟悉的 Flutter 技术栈开发 OpenHarmony 应用，3.35.7 及以后的适配版本可基于本仓库源码构建支持 OpenHarmony 的 Flutter Engine。
Dart
1.04 K
271
ops-transformer本项目是CANN提供的transformer类大模型算子库，实现网络在NPU上加速计算。
C++
880
2.03 K
mindquantumMindQuantum is a general software library supporting the development of applications for quantum computation.
Python
183
112
openHiTLS旨在打造算法先进、性能卓越、高效敏捷、安全可靠的密码套件，通过轻量级、可剪裁的软件技术架构满足各行业不同场景的多样化要求，让密码技术应用更简单，同时探索后量子等先进算法创新实践，构建密码前沿技术底座！
C
1.11 K
682