Question

当屏幕宽度进入iPad范围时，我被要求让这个论坛的口号“Powering the safety revolution”消失。为了测试我使用750像素的屏幕宽度。在或低于此值，我希望它消失。

http://brightideasforum.unitedsafety.net/phpbb3

代码在那里但是当我将屏幕尺寸拖动到750像素以下时，display:none不会生效。

这是一个phpBB 3.0论坛。我刷新了模板和主题，清除了缓存，清除了我的浏览器缓存。

CSS就在这里：

http://brightideasforum.unitedsafety.net/phpbb3/style.php?id=2&lang=en

适用的CSS：

#powering-top{
    height:auto; 
    float:right; 
    clear:both;
}
#powringbox-box {
    color: #000;
    position: relative;
    margin-right: 5px;
    margin-top:0px;
    display: block;
    float: right;
    text-align: right;
    white-space: nowrap; /* For Opera */
}
#powringbox-box h2{
    float:right;
    margin-right:0px !important;
}

@media only screen and (max-device-width : 750px) {
    #powringbox-box {
        display: none;
    }

Answer 1

使用max-width代替max-device-width。

正如@showdev在上面评论的那样，使用max-width更适合您的情况（以及大多数情况）。除非您真正关心我的显示器的大小，否则无论您的浏览器窗口大小如何，max-device-width都无济于事。

为什么我的媒体查询不起作用？

1 个答案: