html - 横幅图像被剪裁，未显示为完整的浏览器宽度

Question

我有一个程序员为我的网站编写了一个页面，但是当我们将代码迁移到我的网站（在 Shopify 上）时，一些事情停止了工作。我几乎可以修复所有问题，但顶部横幅仍然给我带来了麻烦。

我希望它填充整个浏览器宽度（就像页面下方的另一个横幅一样），但它被剪裁为 970px 宽。如何解决此问题以使其响应并填充整个浏览器宽度？我还希望整个页面在标题下居中。

我正在使用的代码在这里（我包括完整的代码，所以我不会错过任何重要的东西）：codepen.io/anon/pen/xZZwZN

当我在 codepen 中运行它时，它可以工作，所以我想知道它是否因为页面宽度编码到我的 Shopify 主题中而被剪裁了。有关如何仅在此页面上修复/覆盖此问题的任何想法？

Answer 1

从.container .columns的 css 中移除float : left以居中对齐。

更改后，页面如下所示 -

希望有帮助！

Answer 2

正如我在您的网站中看到的那样，您只需float:left;从特定页面的skeleton.css链接中删除，因此进入此文件并从.container .column, .container .columns 此类中删除，您的网站就可以了:) 如果您找不到该类，请注意行号26 在您的 css 文件中。