更改响应式 HTML 通讯模板的宽度来自 Charles Mudy

Question

找到模板

我喜欢这个模板，但是我在更改宽度和让它正确响应时遇到问题，我不知道为什么。在顶部的评论中，提到要更改宽度，只需查找并替换以下尺寸即可：

    wrapper   : '500',
    columns   : '210',
    x-columns : [
                    left : '90',
                    right: '350'
            ]

但是，将包装器更改为 750，将列更改为 335（750 的一半，然后负 80 用于填充等，就像 500/210），并将 x 列分别更改为 142 和 448，事情不起作用符合预期。

当我缩小浏览器时，模板直到 480 像素才对齐到一列，使右列在 481-750 像素范围内部分不可见。如果我恢复到原始尺寸，它可以找到。我不确定我错过了什么。

Answer 1

您还需要编辑 @media 规则。它位于模板中的 line 103 上。

您正在调整模板的 width 和 max-width，但没有考虑元素的响应式设计。由于您实际上是在使所有元素变大，因此您也需要使 breakpoint 变大。 You can read more about media queries here.

Change width of Responsive HTML Newsletter Template from Charles Mudy