移动视图中的wordpress水平滚动部分

Question

我在 WordPress 中创建了一个部分，其中有多个列。但在移动视图中，它会在另一个视图下显示一个。我想在一行中显示列。如何在移动版本中水平滚动并排显示多列，而不是一列在另一列下？如何使用 elementor 在 WordPress 移动视图中创建水平滚动部分？请帮我 。 预先感谢。

Answer 1

创建一个容器并使用自定义类“card-content”添加任意数量的列。 你必须添加一个自定义CSS类到父节点 列容器，因此为此我为第一列“cardContent1”添加了自定义 CSS id 然后我在页面中添加了自定义js：

var cardContent1 = document.getElementById("cardContent1");
var parentNode = cardContent1.parentNode;
parentNode.classList.add("card");

然后将自定义 CSS 添加到页面中

.card {
  background-color: #fff;
  min-width: 100%;

}
.card{
    display: flex;
    -webkit-overflow-scrolling: touch;
}

.card {
  flex-wrap: nowrap;
  overflow-x: auto;
}

.card::-webkit-scrollbar {
  display: none;
}

.card-content{
    flex: 0 0 auto;
    margin: 5px;
}

就是这样。

Answer 2

这有效吗？我正在努力解决同样的问题。您有关于该怎么做的任何屏幕截图或视频吗？谢谢