双击或捏缩放时，灯箱化图像会失真答案

【问题标题】：Lightboxed images get distorted when double-tapping or pinch-zooming双击或捏缩放时，灯箱化图像会失真
【发布时间】：2017-02-15 08:53:28
【问题描述】：

我正在使用 Photoswipe Masonry Gallery 插件 (WP)，但是当图像被双击或捏缩放时，它们会变形。

知道是什么原因造成的吗？这不是插件问题，因为它在切换到二十五主题时可以完美运行。仅供参考，我正在使用<meta name="viewport" content="width=device-width">。我正在使用的以下 CSS 中有什么可疑之处吗？

@media screen and (max-width: 700px) {
    /* basics */

    #content,
    #sidebar,
    .endbar_left,
    .endbar_right {
        float: none;
        width: 100%;
    }
    #content {
        margin-left: 0%;
        padding-left: 0%;
        padding-top: 20px;
    }
    html,
    body {
        width: auto !important;
        overflow-x: hidden !important;
    }
    img {
        border: none;
        max-width: 100%;
        height: auto;
    }
    #header {
        padding-bottom: 0 !important;
    }
    /* posts */

    .inside2 {
        padding: 0 10px 10px 10px;
    }
    .post {
        padding-right: 3px;
    }
    .pics_article {
        float: none;
        margin-left: 0;
    }
}

提前感谢您的帮助。仅供参考，我不是网络开发人员。具有良好 html/css 知识的人。谢谢！

【问题讨论】：

感谢@pierre-lebon 的编辑。抱歉，我是新来的……

标签： css pinchzoom photoswipe distortion

【解决方案1】：

刚刚自己找到了解决方案！这是我的img 属性中的!important;（不是在上面发布的@media 查询中，而是在CSS 的主要部分中）导致了这种失真。从下面删除!important; 已解决此问题。

img {
    border: none;
    max-width: 100% !important;
    height: auto;}

【讨论】：