Highcharts Legend 问题：我想让 Legend 100% 宽度和文本中心对齐它在 crome 中工作正常，但在 Firefox 中没有对齐中心

Posted 2023-02-16

【中文标题】Highcharts Legend 问题：我想让 Legend 100% 宽度和文本中心对齐它在 crome 中工作正常，但在 Firefox 中没有对齐中心

【英文标题】：Highcharts Legend issue: I Wanted to make Legend 100% width and text center align it works fine in crome but it is not aligned center in firefox

【发布时间】：2021-10-04 01:08:28

【问题描述】：

在 crome 和 firefox 上尝试https://jsfiddle.net/74cgu6pm/7，您将了解这个问题。legend: width:'100%' ,

【问题讨论】：

为什么不从图例中删除这个属性？默认情况下，它将居中。使用firefox应该是bug

其实是默认居中的。你能看出有什么不同吗？ jsfiddle.net/BlackLabel/gauk938v

其实因为某种原因，我想把它填满，默认是宽度的一半。所以我想用宽度：100%

请问为什么需要全宽的图例？

【参考方案1】：

如果您想要全宽和居中的图例，您可以使用带有 html 和 CSS 的自定义图例，并使用 CSS 属性来设置它们的样式

display: flex;
justify-content: space-around;

否则使用 Highcharts 的 itemDistance 属性

legend: 
        itemDistance: 100
    ,