使用最大宽度停止调整图像大小：100％

Question

我在网站上使用了三列Skeleton布局。所有这些都是我想要的，除了一件事。我有一个图像对齐并在桌子上方。见下文：

http://www.cosworth-europe.co.uk/catalogue/pistonringsets.html

如果我将max-width:100%;添加到图片中，它会略微收缩并使其与我的桌子不一致，然后我甚至会通过浏览器调整大小。见这里：

http://www.cosworth-europe.co.uk/catalogue/pistonringsets2.html

我有没有办法保留max-width，但是在屏幕尺寸发生变化之前它根本没有调整大小？

HTML

<div class="six columns">
    <img src="../images/catalogue/pistonringslarge.jpg">
    <p style="padding-top:10px;"></p>

    <table style="font-size:11px; width:380px; margin-left:20px;">
        <tbody>
            <tr>
                <td style="padding-right:5px; width:70px;">Product Code</td>
                <td style="background-color:#133D8D; color:white; padding-left:5px;">Description</td>
            </tr>

CSS

.container .six.columns {
    width: 340px;
}

Answer 1

正如列出先生所指出的......我的形象很好，实际上是由于增加了20px的余量而使得桌子过度生长了。我删除了保证金并将max-width：100％添加到我的表中。一切都很好。