我已经在我的 ol 中自定义了数字的外观。现在我不知道如何使多行的列表项长时间缩进到与第一行相同的点。文本在数字下环绕。
我对无序列表有同样的问题，但在 CSS 中使用它修复了：
ul.indentedList li {
list-style-position: outside;
margin-left: 1em;
}
但是我无法使用自定义的有序列表来完成这项工作。
这是我正在使用的内容：
.custom-counter ol{
counter-reset: myCounter;
}
.custom-counter li{
list-style: none;
counter-increment: step-counter;
}
.custom-counter li:before {
content:counter(step-counter);
color: white;
background: #ff5100;
display: inline-block;
text-align: center;
margin: 5px 10px;
line-height: 40px;
width: 40px;
height: 40px;
border-radius: 50%;
}
和小提琴：https : //jsfiddle.net/aLkvwu84/1/
根据评论反馈更新。我决定使用flex并使其按照我认为您正在寻找的方式工作，看看这个小提琴
.custom-counter li{
display: flex;
}
.custom-counter li:before {
flex: 0 0 40px;
}
// To remove the added margin on top of the paragraph.
.custom-counter li p {
margin-top: 0px;
}
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句