在屏幕上隐藏div ID

Question

嗨，提前提醒我想在手机上隐藏div ID &创建最小屏幕尺寸。任何小于997px的宽度都是我想要隐藏div id的地方。

我的CSS

@media only screen and (min-device-width : 997px) { 
    #DIV_1 { display:none; } 
} 
#DIV_1 { 
    box-sizing: border-box; 
    color: rgb(51, 51, 51); 
    cursor: default; 
    height: auto; 
    position: relative; 
    width: 222px; 
    perspective-origin: 111px 279.5px; 
    transform-origin: 111px 279.5px; 
    border: 0px none rgb(51, 51, 51); 
    font: normal normal normal normal 16px/16px Arial, Helvetica, sans-serif; 
    margin: 0px 0px 30px; 
    outline: rgb(51, 51, 51) none 0px; 
}/*#DIV_1*/ 

这里是链接 https://www.superherodigital.com/services/graphic-design/

灰色的边栏是DIV_1

Answer 1

您目前正在使用min-device-width: 997px这意味着#div_1应该被隐藏，如果屏幕尺寸大于997px。您应该改为使用(max-width : 997px)，@media-query应放置在样式表的末尾。

将此代码添加到您的样式表：

#DIV_1 { 
    display: block; 
    box-sizing: border-box; 
    color: rgb(51, 51, 51); 
    cursor: default; 
    height: auto; 
    position: relative; 
    width: 222px; 
    perspective-origin: 111px 279.5px; 
    transform-origin: 111px 279.5px; 
    border: 0px none rgb(51, 51, 51); 
    font: normal normal normal normal 16px/16px Arial, Helvetica, sans-serif; 
    margin: 0px 0px 30px; 
    outline: rgb(51, 51, 51) none 0px; 

@media (max-width : 997px) { 
    #DIV_1 { display:none; } 
}