css - *只需使用最小宽度* 隐藏一个 div 元素

Question

仅使用最小宽度 我想隐藏 challange-target 元素低于 408px 并显示 challange-target 最大 408px。

我试过这段代码，但它不起作用:

@media only screen and (min-width: 408px) {
    .challange-target {
        display: block;
    }
}

有什么想法吗？

这是 jsfiddle link

Answer 1

你的意思是你想在屏幕宽度 < 408 时隐藏 .challenge-target，当屏幕宽度 >= 408px 时以 408px 显示它？

最小的优先；隐藏那个元素

.challange-target {
    display: none;
}

@media only screen and (min-width: 408px) {
    .challange-target {
        display: block;
        width:408px;
    }
}