如何使它具有响应能力？

Question

我建立了一个网站，但在使用CSS时遇到了麻烦，让我向您展示。

这是在PC或笔记本电脑上的完整宽度，在移动设备上是：

让我告诉我我的代码：

.partners {
    display: inline-flex;
    width: 100%;
    height: 250px;
    overflow-x:scroll;
    overflow-y:scroll;
}
.partners img {

    margin-left: 10px;
}
.partnercard {
    margin-top: 25px;
    margin-left: 10px;
    width: 150px;
    background-color: white;
    padding: 2rem 0.5rem;
    box-shadow: 0 1px 1.5rem rgba(0,0,0,.1);
    border-radius:1rem;
    height: 150px;
    text-align: center;
z-index:1;
margin-bottom: 5px;
}
.partners .partnercard a img {
    height: 100%;
}

这就是整个

我尝试了

@media screen and (max-width: 864px) {
  .partners {
    width:100%

}

但是它不起作用，overflow-x可以在全角上工作，但是在移动设备中它消失了

我希望这些卡的宽度与桌面视图中的宽度相同，并且具有x溢出功能，

你能帮我吗？

Answer 1

您是否尝试过将宽度设置为

.partners .partnercard a img {

如果我没记错的话，您的媒体查询也不会更改任何内容，因为在两种情况下均为100％