css - CSS在flexbox容器中用边距包装项目,固定高度溢出到顶部
问题描述
我有一个具有设定大小的 flexbox 容器,以及包裹并应该定位在容器中的总中心的项目,但是如果它们溢出容器,容器应该垂直滚动。但是,它们的边距会导致第一行中的第一个项目没有完全包含在滚动容器中。有人知道如何解决这个问题吗?
.container {
width: 400px;
height: 300px;
display: flex;
flex-wrap: wrap;
justify-content: center;
align-items: center;
align-content: center;
background-color: blue;
overflow-y: auto;
}
.container > div {
background-color: red;
width: 100px;
height: 100px;
margin: 32px;
}
<div class="container">
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
</div>
解决方案
推荐阅读
- database - LARAVEL 5.8 - 在 foreach 中使用数组的 WHERE LIKE 子句的多个条件没有给出完整的结果
- angular - 在 chart.js 中动态更新时间数据会冻结图表
- python - 如何计算客户状态变化的次数
- tensorflow - 获取BERT最后4层的输出(Tensorflow)
- python - 如何使用python将变量插入MySQL表
- excel - 获取表格列Excel VBA的范围(或值)
- python - pycharm 无法在 Windows 10 上安装 Tensorflow
- html - 如何跨页面保存嵌入代码中的会话
- raspberry-pi3 - 有没有办法同时“打印”两个加速器的值?
- android - 在没有android studio布局编辑器的情况下通过xml创建android布局