如何激活Chrome中的CSS代码

发布于 2025-02-13 11:48:14 字数 541 浏览 2 评论 0原文

我正在使用OpenCart 3.0.3.8。 eShop是 https://morrisdirect.co.uk 在stylesheet.css文件的末尾，我添加了以下CSS代码：

@media all and (min-width: 900px) {
    .container-two-columns {
    }
    .columns-two-columns {
       column-count: 2;
       column-gap: 0.3em;
    }
}

我正在从主页（和更多页面）调用此CSS代码，以将（下方）图片（在滑块下方）相互隔开。它在桌面Firefox和Opera中完美运行，但并未在Chrome中运行。

你能帮我吗？ :)

“结果”

原文

I am using OpenCart 3.0.3.8. The eshop is https://morrisdirect.co.uk
At the end of the stylesheet.css file, I added the following CSS code:

@media all and (min-width: 900px) {
    .container-two-columns {
    }
    .columns-two-columns {
       column-count: 2;
       column-gap: 0.3em;
    }
}

I am calling this CSS code from the homepage (and some more pages) to put the (below the slider) pictures next to each other. It is running perfectly in desktop Firefox and Opera, but it is not running in Chrome.

Can you help me please? :)

The result

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

咆哮 2025-02-20 11:48:14

您需要制作＆lt; a＆gt;元素块元素才能起作用：

@media all and (min-width: 900px) {
    .columns-two-columns {
       column-count: 2;
       column-gap: 0.3em;
    }
    .columns-two-columns > a {
        display: block;
    }
}

您不需要：

.container-two-columns {
    }

因为它没有做任何事情。

You need to make the <a> elements block elements for this to work:

@media all and (min-width: 900px) {
    .columns-two-columns {
       column-count: 2;
       column-gap: 0.3em;
    }
    .columns-two-columns > a {
        display: block;
    }
}

You don't need the:

.container-two-columns {
    }

Since it's not doing anything.

回复收藏 0 原文

晨曦÷微暖 2025-02-20 11:48:14

这可能是按照您的代码的一种方式：

@media all and (min-width: 900px) {
.container-two-columns {
}
.columns-two-columns {
    column-count: 2;
    column-gap: 0.3em;
    display: grid;
    grid-template-columns: 1fr 1fr;
}

}

This can be one way as per your code:

@media all and (min-width: 900px) {
.container-two-columns {
}
.columns-two-columns {
    column-count: 2;
    column-gap: 0.3em;
    display: grid;
    grid-template-columns: 1fr 1fr;
}

}