Question

我有一个容器，用于在选择时通过一系列文档显示面包屑路径。

每个面包屑元素都是一个div，浮动到左边，这样它们就能很好地堆叠在一起。它们的宽度由文本内容设置，文本内容是文档的标题。长度会有很大差异。

会发生什么： 当面包屑列表元素变得太长而无法在容器中显示时，它们应该调整大小，确保所有元素在容器中保持可见。

问题： 这似乎有效，但只有一点。一旦面包屑列表对于容器变得太长，我将容器宽度除以存在的面包屑元素的数量，并相应地设置元素宽度。但是，这将无法一致地工作，有时会显示列表中的最后一个文档，但如果选择则拒绝显示其直接父级。

理想情况下，面包屑元素应该简单地缩小以确保它们全部显示，就像窗口图标的大小在窗口任务栏中显示一样。

Iv做了一个小小的提示，大致突出显示正在发生的事情，甚至在这里你可以看到元素没有正确调整大小以确保它们全部显示。这是最明显的，因为添加了8个或更多元素。

有人可以告诉我，我做错了吗？

非常感谢

MVK

Answer 1

你必须减去填充，边距和边框大小（在你的情况下：填充为9px，2 * 3，边框为2 * 1，左边距为1）到按钮宽度：

var Lok = (BredWid / ButCount)-9;

这是一个简单的例子：

您会注意到总宽度并不完全等于容器宽度（按钮后面有一个小的空白），这是由于宽度的四舍五入。

在第一个示例（您的版本）中，最后的空白是由于小于Lok的按钮。