Question

我在这里与朋友讨论，可以看到一个例子。容器的宽度是500px还是580px？我们的意思是从横幅图片的两侧开始，在整个文本中一直是直线。

我们查看了检查窗口，但我们找不到宽度应该在哪里。

该网站是在表格中制作的，因为该设置适用于电子邮件简报。

设置宽度的示例位于html：

中

<!-- Top Picture Start -->
<table class="row background-color__blue">
    <tr>
        <td class="center img-position" align="center">
            <center>
                <table class="container">
                    <tr>
                        <td class="wrapper last">
                            <table class="twelve columns">
                                <tr>
                                    <td>
                                        <a class="remove-banner-space" href="http://google.dk"><img width="580" height="300" src="http://d21vu35cjx7sd4.cloudfront.net/dims3/MMAH/crop/586x293%2B0%2B95/resize/580x290%5E/quality/90/?url=http%3A%2F%2Fs3.amazonaws.com%2Fassets.prod.vetstreet.com%2F4a%2Ff0%2Fc29d3f434ae6abd19f5433140124%2Fborder-collie-AP-XO4EXW-590sm52314.jpg" alt="Test" /></a>
                                    </td>
                                </tr>
                            </table>
                        </td>
                    </tr>
                </table>
            </center>
        </td>
    </tr>
</table>
<!-- Top Picture End -->

在CSS中，它也应该设置为580px：

table.container {
            background: #fefefe;
            width: 580px;
            margin: 0 auto;
            Margin: 0 auto;
            text-align: inherit;
        }

Answer 1

在浏览器工具/检查器中（至少在Firefox中），有一个名为“计算”的标签（不确定英语中的确切术语，因为在我的情况下，它是另一种语言）。这将显示计算出的（即实际）宽度，以及添加到它的所有内容：边距，边框，填充，内部宽度 - CSS框模型的良好表示。

找到容器宽度

1 个答案: