双击或捏缩放时，灯箱图像会变形

Question

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

知道造成这种情况的原因是什么？这不是一个插件问题，因为它切换到Twenty Fifteen主题时效果很好。仅供参考，我正在使用<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知识。谢谢！

Answer 1

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

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