无法让我的@media 代码触发，你知道为什么吗？

Question

body .gilidPanel-opener {
top: 55%;
}

@media all and (max-width: 700px){
body .gilidPanel-opener {
  top: 85%;
}
}

我在上一个问题中被告知，如果我使用值“top”，我需要在元素上使用“absolute”。绝对破坏了我元素的功能，有人知道解决这个问题的方法吗？

如果您想亲自查看，该页面是 www.focallocal.org，它位于屏幕最左侧的选项卡，我希望在移动设备上显示在下方，以免妨碍阅读。

Answer 1

这叫做媒体查询，没问题。它不起作用的原因是因为您的默认 css 具有比这更高的优先级。您已经在使用fixed 位置，所以top 应该可以正常工作。使用这个

@media all and (max-width: 700px){
  body .gilidPanel-opener {
    top: 85% !important;
  }
}