媒体查询在某些类中没有在Bootstrap中工作，但与其他类一起工作

Question

我有媒体查询，但出于某种原因，某个特定课程不起作用。我为此使用了Bootstrap模式。我需要这个才能在420宽度下工作得最好。

这是我的CSS代码：

@media (min-width: 768px) { 
    .caracs{
    width: 500px !important;
    font-family: 'Poppins', sans-serif;
    } 
    .panel{
    text-align: center;
    height: 255px;
    }
    .nombre-datos{
        display: inline-block;
        font-size: 0.8em;
        text-align: justify;
    }
}
@media (min-width: 992px) { 
    .caracs{
        width: 810px !important;
        font-family: 'Poppins', sans-serif;
    }
    .nombre-datos{
        display: inline-block;
        font-size: 0.8em;
        text-align: justify;
    }

}
@media (min-width: 1200px) { 
    .caracs{
    width: 810px !important;
    font-family: 'Poppins', sans-serif;
    }
    .panel{
        text-align: center;
        height: 165px;
    }
}

特别需要：

.nombre-datos{
    display: inline-block; /*Necesario para que los divs estén en el mismo renglón*/
    width: 250px !important;
    font-size: 0.8em;
    text-align: justify;
}

改变。我想在小屏幕上删除 width：250px！important 属性，当我在浏览器中调整窗口大小时，它根本不起作用。

以下是一些照片：

这是它在普通屏幕视图中的显示方式：

以下是它对小型设备的响应方式：

这就是我希望它看起来的方式，删除指定的属性（我使用Firefox检查器/开发工具删除它）：

发生了什么事？

Answer 1

Okai，我不完全确定发生了什么，但这样做：

意思是，将查询从 min 更改为 max 并强制使用！important 一些东西做了没有弄乱其他任何东西。

 @media (max-width: 992px) { 
    .caracs{
        /*width: 810px !important;*/
        font-family: 'Poppins', sans-serif;
    }
    .nombre-datos{
        width: 364px !important;
        display: inline-block;
        font-size: 0.8em;
        text-align: justify;
    }
}