html - 带有水平列表的 Flexbox 添加一个 padding-left
问题描述
为什么即使使用 justify-content: space-between ,Flexbox 也会在水平列表上添加左填充?
<div class="list-container">
<ul>
<li>One</li>
<li>Two</li>
<li>Three</li>
<li>Four</li>
<li>Five</li>
</ul>
</div>
.list-container {
width: 500px;
background-color: darkseagreen;
}
.list-container ul {
display: flex;
justify-content: space-between;
list-style: none;
}
.list-container li {
flex: 0 0 auto;
background-color: darkorange;
}
jsfiddle:https ://jsfiddle.net/telemacus/vdo9a54c/10/
在“ul”上添加“padding-left:0”可以解决问题。
解决方案
推荐阅读
- linux - 在我的 bash 脚本中使用 mkdir 并拒绝获得权限
- c++ - 如何从 .txt 文件中获取初始化的指针
- php - 为什么我不能在我的 php 代码中执行这个终端命令?
- java - 更新 PlayerNotificationManager 信息而不创建另一个
- python - 如何在python中使用类方法?
- c - 为什么我在这个问题上得到了错误的答案(Uva OJ 455)
- java - 如何使用 visibleProperty.bind
- node.js - 指定应该只插入列而不是更新插入
- excel - 使用 VBA 将字段从另一个数据源添加到数据透视表
- python-3.x - 展开列表在 Python 中返回意外错误