如何在“oe_structure”中放置“轮播”div而不重叠答案

【问题标题】：How to put a "carousel" div inside "oe_structure" without overlapping如何在“oe_structure”中放置“轮播”div而不重叠
【发布时间】：2021-01-21 20:36:43
【问题描述】：

我需要在“oe_structure”中放置一个“carousel” div，但不能正常工作，“carousel”：

我正在编辑模板“website_sale.products”

我是 odoo 的新手，我可以继承我的直接代码来编辑吗？但我仍然不知道如何将滑块放入 div 中，如图所示！

我使用的代码链接：

https://codeshare.io/2pBqez

我对 div carousel 的错误是：

【问题讨论】：

嗨，你也可以分享 CSS/JS 的其他表格吗？我无法仅使用您共享的代码复制您的页面，谢谢
嗨@LaurentC，技术是Odoo13！继承组件，就是我没有css和js！
我明白了。这是不幸的。好吧，我会给你一个快速的小演示，你可以尝试在你的代码中实现吗？否则，我需要实时访问您的 CMS 以提供更多帮助。
因此，如果您可以使用/添加自定义代码，您可以添加轮播代码并使用我建议的 3 种方法之一定位它，如果您需要 + 帮助，请告诉我
@LaurentC thxs。当然，我们可以创建实时访问！问题是当我将 div 与 class:row o_wsale_products_main_row 放在一起时，如果我提到我是 Odoo 的新手并且我一直在努力提高我的 Python 能力！

标签： css layout bootstrap-4 carousel odoo-13

【解决方案1】：

<div class="container">
  <div class="square"><div>
    <div class="s-square">
</div>

.container {
  width:80%;background:lightgray;height:500px;margin-left:10%;
  display:flex;justify-content:center;align-items:center;
} /* this container is positioned using a left-margin */

.square {width:250px;height:250px;background:white;position:relative;} /*this square is positioned by the flexbox display of its parent container (.container) */

.s-square {height:100px;width:100px;background:blue;position:absolute;top:50px;left:60px;3px dashed purple;} /* this is absolute positioning and should be avoided as much as possible b/c not very responsive-friendly */

【讨论】：