如何防止内联列表元素的边在HTML中被截断？

我对内联列表元素有问题

问题是，当我限制包含内联列表元素的菜单的宽度以将其放在多行（对于移动设备）上时，元素的右侧被切断

下面是一个JSFIDLE，显示了以下内容：

橙色菜单中包含：

width: 210px;
background-color: #ffc20e;

在这个JSFIDLE中，第二个列表元素的右侧被切断。在“菜单”类的div中，它旁边有很多空间，所以不是因为这个。我想这是因为一些我不知道的内联列表属性

当列表扩展到第二行时，如何防止内联列表元素的右侧被截断？

好的，我找到了一个解决方案：

---

我删除了列表，并使所有元素内联块，如果需要，您可以编辑它们的宽度和高度

简单的CSS修复程序应该可以做到这一点

您需要修改li元素，使其成为具有定义宽度的内联块：

.menu li {
    display: inline-block;
    width: 90px;
}

请看这里：

---

编辑

---

我玩过了，看看这是不是你想要的：

GENIUS！！谢谢你。

.menu li {
    display: inline-block;
    width: 90px;
}