Html 停止调整图像大小,最大宽度:100%

Html 停止调整图像大小,最大宽度:100%,html,css,skeleton-css-boilerplate,Html,Css,Skeleton Css Boilerplate,我正在为我的网站使用三列框架布局。除了一件事之外,一切都是我想要的。我有一个图像对齐并位于桌子上方。见下文: 如果我添加最大宽度:100%到图像,它会稍微收缩,并在我还没有通过浏览器调整大小之前将其移动到与我的表格不一致的位置。请看这里: 有没有办法保持最大宽度,但在屏幕大小改变之前它根本不会调整大小 HTML 正如罗列先生所指出的。。。我的图像很好,事实上,由于增加了20px的边距,表中的div已经过大了。我删除了边距,并将最大宽度:100%添加到我的表格中。现在一切都很好。您的.six.

我正在为我的网站使用三列框架布局。除了一件事之外,一切都是我想要的。我有一个图像对齐并位于桌子上方。见下文:

如果我添加
最大宽度:100%到图像,它会稍微收缩,并在我还没有通过浏览器调整大小之前将其移动到与我的表格不一致的位置。请看这里:

有没有办法保持
最大宽度
,但在屏幕大小改变之前它根本不会调整大小

HTML


正如罗列先生所指出的。。。我的图像很好,事实上,由于增加了20px的边距,表中的div已经过大了。我删除了边距,并将最大宽度:100%添加到我的表格中。现在一切都很好。

您的
.six.columns
div的宽度为340px,因此img的宽度也很大(其自然宽度为399px)。一切都按预期进行。除了下表较宽,但表溢出了div。如果您将
overflow-x:hidden
应用于div,您可以自己检查,然后您将看到img与表的可见部分的宽度完全相同。谢谢李斯特先生,我现在明白您的观点了。桌子已经满了,这就是问题所在——你有什么建议吗,我应该在桌子上放一个最大宽度吗?
<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>
.container .six.columns {
    width: 340px;
}