中心绝对定位溢出div
击打兄弟
这就是我尝试过的方法，可让我99％达到目标。
.polaroids-container {
overflow-x: auto;
position: relative;
height: 245px;
padding-top: 10px;
display: -webkit-flex;
-webkit-justify-content: center;
display: flex;
justify-content: center;
padding-left: 0;
padding-right: 0;
}
.polaroids {
position: absolute;
min-width: max-content;
}<div class="container-fluid">
<div class="container polaroids-container">
<div class="polaroids">
<div>Images here</div>
<div>Images here</div>
<div>Images here</div>
<div>Images here</div>
<div>Images here</div>
<div>Images here</div>
</div>
</div>
</div>
这将使我的内容居中，但是div中的第一个元素在左侧被切断。正如您在图像中看到的，滚动条一直位于左侧，因此您无法向左滚动以查看该内容。
这里的目标是将所有div集中在班级内polaroids，而不要砍掉第一个div 。
Nosajimiki
好吧，我做了个小提琴，然后看看你现在在做什么。将“ left：0”添加到宝丽来中。设置对齐方式后，请使用JavaScript将滚动条设置为居中。
.polaroids {
position: absolute;
left:0;
min-width: max-content;
}
<script>
var polaroidsCont = document.getElementsByClassName("polaroids-container")[0];
var polaroidsInner = document.getElementsByClassName("polaroids")[0];
polaroidsCont.scrollLeft = (polaroidsInner.offsetWidth/2 - polaroidsCont.offsetWidth/2);
</script>
本文收集自互联网，转载请注明来源。
如有侵权，请联系 [email protected] 删除。
编辑于
相关文章
TOP 榜单
- 1
Android Studio Kotlin：提取为常量
- 2
IE 11中的FormData未定义
- 3
计算数据帧R中的字符串频率
- 4
如何在R中转置数据
- 5
如何使用Redux-Toolkit重置Redux Store
- 6
Excel 2016图表将增长与4个参数进行比较
- 7
在 Python 2.7 中。如何从文件中读取特定文本并分配给变量
- 8
未捕获的SyntaxError：带有Ajax帖子的意外令牌u
- 9
OpenCv：改变 putText() 的位置
- 10
ActiveModelSerializer仅显示关联的ID
- 11
算术中的c ++常量类型转换
- 12
如何开始为Ubuntu开发
- 13
将加号/减号添加到jQuery菜单
- 14
去噪自动编码器和常规自动编码器有什么区别？
- 15
获取并汇总所有关联的数据
- 16
OpenGL纹理格式的颜色错误
- 17
在 React Native Expo 中使用 react-redux 更改另一个键的值
- 18
http：// localhost：3000 /＃！/为什么我在localhost链接中得到“＃！/”。
- 19
TreeMap中的自定义排序
- 20
Redux动作正常，但减速器无效
- 21
如何对treeView的子节点进行排序
我来说两句