如何解决具体化模式问题答案

【问题标题】：How to fix materialize modal issue如何解决具体化模式问题
【发布时间】：2020-06-15 11:58:01
【问题描述】：

我在我们的项目中使用materialize.css，我使用了materialize popup。我的简单要求是弹出窗口应该是身体的垂直中心。是的，我尝试了自己，它也运行良好，但面临一些问题。内部弹出内容显示模糊不知道为什么如果有人知道请分享您的反馈。

【问题讨论】：

请分享网站链接或代码示例。用 codepen 复制问题。默认情况下，模式是居中的，因此其他一些 css 或您构建站点的方式会导致冲突。根据截图无法知道如何。
@sean top: 50% !important;底部：自动！重要； -webkit-transform: translateY(-50%) !important; -ms-transform: translateY(-50%) !important;变换： translateY(-50%) !important;高度：自动！重要；
我只是为垂直中心使用了一些额外的代码，但没有工作
粘贴到 cmets 中的代码不算数。

【解决方案1】：

以下是我用来使我的模态居中的：

#modal {
    top: 50% !important;
    transform: translateY(-50%) scaleX(1) !important;
}

这应该替换物化样式表中默认的top: 10% 和transform: scaleX(1) scaleY(1) !important 设置。您可以使用 div ID、类或元素本身的样式来获取样式以覆盖默认实现样式，或者仅替换 materialize.css 文件本身中的 css。

【讨论】：