时间戳

首页 > 解决方案 > 减少 li 元素之间的空间

html - 减少 li 元素之间的空间

问题描述

如何减少代码中 li 水平元素之间的空间，我一直在尝试通过更改填充和边距属性来做到这一点（我已经尝试将这些属性设置为负值，但没有帮助）。

下面是我正在尝试的代码

  footer li {
  display: flex;
  flex-wrap: wrap;
  width: 300px;
  flex-direction: row;
  justify-content: space-around;
  font-size: 20px;
  padding-right: 70px;
  list-style: none;
  margin-left: 10px;
}

标签： htmlcsselement

解决方案

证明列表的父级（而不是列表）开始，这使您可以控制列表 - 列表现在将是灵活的父级 - 如果您遵循本指南，您应该能够使用列表进行任何您想要的

  1. 首先，“display:flex”行改变了显示 - 所以你真的不再使用普通列表了。
  2. 其次，我可以看到您设置了“justify-content: space-around;” 这限制了代码中“边距”的能力；
  3. 将“space-around”更改为“flex-start”并根据需要添加边距，或者让“space-around”完成它的工作

推荐阅读