Html 将内联li换行成相等的行

我有一个可变数量的LI，它们通过CSS在页面的导航菜单中内联显示，如下所示：

 ul.nav{
    margin: 0;
    padding: 0;
    text-align: center;
 }

 ul.nav li{
    margin: 0;
    padding: 5px 10px;
    list-style: none;
    display: inline-block;
 }

当页面变得更窄时，导航菜单会自动换行，但是，我想尝试使每行的项目数相等

例如，当出现9个项目时，页面只适合8个项目，我希望顶部行有5个项目，下面有4个项目，而不是顶部行有8个项目，然后移到下一行。问题是，在这个模板中，它们必须居中对齐，因此如果一行已满，第二行只有一个项目，则看起来非常糟糕

它不一定是精确的，所以某种可能迫使6和3下降的保证金解决方案比8和1更好。有人知道我该怎么做吗

干杯

更新：显然我没有很好地解释自己。我试图平衡行，而不是确保在给定的宽度上有一个特定的数字

让我们举个例子。。。假设我有4次空间，我们会说lis在一个400px的空间中用100px固定

| -----  -----  -----  ----- |
||     ||     ||     ||     ||
| -----  -----  -----  ----- |

现在，当我有5个项目，而不是4和1，我想要这个

|    -----  -----  -----     |
|   |     ||     ||     |    |
|    -----  -----  -----     |
|        -----  -----        |
|       |     ||     |       |
|        -----  -----        |

对于6项，第3项和第3项 对于7项，第4项和第3项 对于8项，第4项和第4项 9项，3项和3项

---

现在我开始用PHP编程，但这并不能解决人们调整窗口大小的问题，如果你的div大小是固定的，那么请给一个特定的li的固定宽度。 例如 假设你有一个像500px的div，现在我们想要4个在上面，1个在下面。因此，li宽度约为110px

---

因此，请尝试固定您的li宽度

您应该将前5个封装在另一个具有display:inline块的div中，其余的封装在另一个具有display:inline块的div中，当宽度小于此值时，应将其拆分为两个

或者您可以编写媒体查询，使其在不同的屏幕大小上表现不同

---

帕万走上了正确的道路。如果您希望在最上面一行保留一定数量的LIs作为最小值，那么在UL上设置最小宽度也是很有帮助的。如果将溢出保留为默认值，则可以覆盖div宽度

ul li { 
list-style-type: none;
display: inline;
float: left;
width: 100px;

}

ul{最小宽度：300px；}

正文{宽度：200px；}

---

不幸的是，你对我在示例中给出的数字没有兴趣。。我有3到15件物品，根据它们的大小，还有7到8件的空间。我希望有一个在两行之间平均分配项目的设计。为什么不写一个脚本，可以测量导航div的长度，将每个li的宽度相加，然后将它们分成2，并相应地显示li呢？这就是我刚才作为选项发布的内容。。我可以用一个新的UL在PHP端实现，但这并不能解决一些使窗口变窄的问题。。因为这样我就有了完整的行，单个项目完整的行，单个项目。我可以如何编写CSS脚本吗？使用jQuery。检查.CSS方法，这应该可以让您开始。这还没有完全解决我的问题。我试着平衡两行，而不是确保最上面一行的某个数字。。我将更详细地更新这个问题。