将未知宽度元素居中于已知宽度元素内

Question

我没有找到解决此问题的方法：

对于导航栏，我有ul具有特定宽度（530px），并且在其中有几个li s。

我希望li s填充所有530px宽度，它们之间的空格相等。我无法对此进行硬编码，因为我不知道每个li的宽度。

Answer 1

我建议使用禁用边框的表...

表格同样将文本分成单个单元格。

Here is a nice description about them

Answer 2

我建议使用Flexbox - 更新的规范相当新，并且您希望使用polyfill或供应商前缀来获得广泛的浏览器支持，但这是此类任务的发展方向。

这是一个关于creating a simple Flexbox-driven horizontal nav的精彩教程，它将向您展示基础知识。

作为you can see，浏览器支持尚不完善，但您可以使用各种填充和技术使其坚如磐石。并don't have to go far找到有关这些资源的更多信息。来自相关SO帖子的关键链接是Chris Coyier的Using Flexbox。