为什么我的@media 中 div 的高度不会改变？ [复制]

【问题标题】：Why won't the height of my div change in my @media? [duplicate]为什么我的@media 中 div 的高度不会改变？ [复制]
【发布时间】：2020-02-13 18:31:43
【问题描述】：

还是新的，但玩了一会儿。在 CSS 父级 .article 中，我设置了高度。当我尝试使用

https://jsfiddle.net/avryx/1wusmqn6/21/

* {
    margin: 0px;
    padding: 0px;
    box-sizing: border-box;
}

@media screen and (max-width:767px) {

    .article {
        padding: 5% 10%;
        height: 1000px;
    }

}

.article {
    background-color: #404040;
    height: 470px;
    width: 80%;
    margin-left: auto;
    margin-right: auto;
    border-radius: 10px;
    margin-top: 2%;
    margin-bottom: 2%;

}

【问题讨论】：

标签： css height

【解决方案1】：

因为 css 是从上到下读取的。最后设置的规则，就是将要执行的规则，所以在.article下面使用@media，像这样：

* {
    margin: 0px;
    padding: 0px;
    box-sizing: border-box;
}

.article {
    background-color: #404040;
    height: 470px;
    width: 80%;
    margin-left: auto;
    margin-right: auto;
    border-radius: 10px;
    margin-top: 2%;
    margin-bottom: 2%;

}

@media screen and (max-width:767px) {

    .article {
        padding: 5% 10%;
        height: 1000px;
    }

}

Demo

【讨论】：

谢谢你:)。你知道这是否通常是它的行为方式？我想我见过其他 CSS 用户将媒体置于其他 CSS 之上。不知道媒体在哪里很重要。
阅读：stackoverflow.com/questions/24456981/…