如何使用 flex 进行响应式设计？

Question

This 是我的网站网址

在检查模式移动视图中，当我单击脚后跟的最后一个圆圈时，其顶部会出现两个圆圈。我希望这两个圆圈出现在中心。

如果我从 css 中删除 justify-content: space-between，那么这两个圆圈会出现在中心。然而，当水平滚动时，第一个圆圈仅部分出现在移动视图中。如何解决这个问题？

谢谢

Answer 1

挖了好久才找到解决办法。

只需在媒体查询中为圆圈的容器提供 100 像素的左边距。

代码：-

.row.align-center.justify-center {
padding-left: 100px;
}

Answer 2

在样式中的 .container height 之后将 Justify Center 添加到 div 并标记为重要

position: relative;
bottom: 215px;
justify-content: center !important;