在屏幕上隱藏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; } 
}