生成一个.custom_li类并给出

.custom_li{
   display:inline-block;
}

• • 编辑**

要强制相同的大小，我建议使用max-width并将其放置在某个media-query下

li{
    display: inline-block;
    max-width:50%; /* limit width */
    word-break:break-all; /* wrap extended text*/
    border:1px solid red /* demo */
}

demo here
some optional things
some optional things

当我尝试display: inline-block;时，它删除了子弹。
相反，我使用float:left;使它们的宽度与文本一样，同时保留了项目符号。可选地，添加clear:both;使其保持为垂直列表，每个项目在新行上。

• • 中央支助组**

.my-list > li {
    float: left;
    clear: both; /* remove this if you want them flowing inline */
}

• • 超文本标记语言**

<ul class="my-list">
    <li>First Item</li>
    <li>Second Item</li>
    <li>Third Item</li>
    <li>Fourth Item</li>
</ul>

如果display: inline-block;或display: block;打乱了对齐。
那就用width: fit-content;

通过添加display: inline-block;到适当的元素来防止它变成一个块。如果你想了解细节，请发布更多的代码，最好是CSS。

我得到了它的工作与以下css：

ul {
    margin: 0 auto;
    width: fit-content;
}
li{
    display:flex;
    margin: 0.5rem auto;
}

基本上我所做的是使容器宽度适合内容。使用CSS技巧来确保它会使用边距居中。在li标签中，我希望内容居中，所以我这样设置它