Div 其中 position:fixed 在移动响应式设计中不可见

Question

我有一个集成了在线聊天脚本的网站。我们创建了一个图像按钮，而不是公司提供的默认 link。

图片所在的div标记为固定位置，在桌面浏览器右下角可见

如果我在移动设备上打开相同的内容，尽管设计是响应式的，但 div 是不可见的。

下面是两个版本都使用的CSS

@media (max-width: 768px){
 #theradome-proonto {
 position: fixed;
 bottom: 30px;
 right: 12px;
 background: white;
 z-index: 99999;
 -webkit-backface-visibility: hidden;
}
}

@media (min-width: 768px){
 #theradome-proonto {
 position: fixed;
 bottom: 30px;
 right: 12px;
 background: white;
 z-index: 99999;
}
}

我的网站是 http://www.theradome.com 它是用 wordpress 构建的

Answer 1

删除 modal.less 中的 #theradome-proonto 第 95 行

此 css 规则为您的 div#theradome-proonto 设置 display: none 那就是影响 div.

正确显示的 CSS 规则

@media screen and (max-width: 767px)
    #STM_root_elem, #theradome-proonto, .doctor_trusted {
        display: none !important;
}

按照 CSS

尝试覆盖它

@media (max-width: 768px){
    #theradome-proonto {
        position: fixed;
        bottom: 30px;
        right: 12px;
        background: white;
        z-index: 99999;
        -webkit-backface-visibility: hidden;
        display: block !important; /* this line is important! */
    }
}

编辑 2 style.css 行 2673 中的内容是什么？因为当我在浏览器中打开 style.css 时，我在 行 2671 - /* rules for all mobile resolutions (< 768) */ 上看到以下评论，其后是CSS 我之前提到过。

如果你找不到它，我最后给你的建议是 - 尝试将我添加的 CSS（这个带有 display: block !important）放在你的 style.css

Div 其中 position:fixed 在移动响应式设计中不可见

Div with position:fixed not visible in mobile Responsive design

html

image

position

fixed