Javascript 在Chrome中，应用匹配高度后，容器元素宽度超过内部元素宽度

我有一个页面在基于Chrome的浏览器（特别是Vivaldi）中以一种奇怪的方式呈现；在Firefox中，没有问题。该页面包含一个跨度，其中包含一个链接，该链接包含一个图像，如下所示：

<span class="container">
    <a href="...">
        <img class="content" src="...">
    </a>
</span>

插件用于将容器的高度与相邻元素的高度对齐

$('.container').matchHeight({
    target: $('#adjacent_element')
});

如果#相邻_元素的高度为100px，并且在应用匹配高度后，图像为200px x x 200px，则在Chrome中会发生以下情况：

• 图像将以100px乘以100px的方式渲染（良好）
• .容器的高度为100px（良好）
• .容器的宽度为200px（有问题）-宽度应与内部图像的宽度相匹配，即100px。Firefox中不会出现此问题

更奇怪的是，如果在Chrome中呈现页面后，我将鼠标光标移到.container上，其宽度将调整为所需的宽度（即在上述场景中为100px）

我希望页面能够在应用matchHeight后，将.container的宽度调整为它包含的图像的宽度。有没有关于如何做到这一点的建议，而不必求助于涉及添加更多javascript代码的笨拙解决方案？看起来，matchHeight插件和CSS的组合应该足以做到这一点（事实上，在Firefox中，它们是）

$('.container').matchHeight({
    target: $('#adjacent_element')
});