WP画廊问题，在移动设备上没有响应

Question

我帮忙为朋友组织/艺术场所清理和翻新网站。

我们正在研究最近几年业务的图像库。查看其中一个gallerys-> http://www.stallbergsgruva.se/2018-2/的链接

我的问题是当我在移动设备（Android和Iphone）上浏览页面时，Gallerys融合在一起并且不能以一种很好的方式显示。例如，将它们全部放在一列或两列中会很好，但是图集分开并且不会像现在一样弄脏。

我正在寻找一些能够解决这个问题的CSS代码。我尝试了一些我在类似问题上找到的不同代码，但没有任何影响我的画廊。我是这个代码的新手，这么多我都错过了什么？

我是代码的初学者，但如果您添加更详细的代码说明以及添加位置等，可以处理它。

先感谢您！ // Erik

Answer 1

这可以通过在媒体查询中定义宽度来完成。我看到你已经定义了

.gallery-width: calc((100% - 16px)/2

根据您需要此结果的分辨率将其更改为.gallery-width:100%。有关媒体查询的更多信息，请访问：

Media Queries

Code Screenshot inside colsole

所以在你的情况下让我们假设高达600px你需要这个结果这就是媒体查询看起来像需要添加到你的css文件的方式：

@media screen and (max-width: 600px) {
  .wp-block-gallery .blocks-gallery-item{
     width :100%;
}
}