Javascript Flot图表：图例和字体

我已经使用jQuery Flot库配置了条形图。代码如下：

<style>
.flot-chart-bar {
    height: 300px;
}
.flc-bar {
    font-size: 2px;
    border: 1px grey solid;

}

现在的问题很简单：如何减小图例中单词的字体大小？我已经尝试过使用CSS和一些我在网上找到的图例属性，但似乎没有任何效果

---

我想减少栏下白色图例中的单词字体。

您的CSS应该可以工作，但是

字体大小：2px可能不是您想要的。
有关CSS中指定字体大小的代码的完整示例，请参见此。
请提供一个工作代码段是抱歉。完成！已经尝试过了，但是css似乎忽略了字体大小命令。使用！重要信息，并签入小提琴它的作品，所以你需要找到你的代码和小提琴之间的差异。
<div class="card profilestats" style="color: #fff !important;">
<div class="card-content" style="background-color: #bdbdbd !important;min-height:320px;">

    <div id="bar-tipoReclamo" class="flot-chart-bar"></div>
    <br>
    <div class="flc-bar" style="background-color: white; "></div>                        

</div>  
<div class="card-action" style="background-color: #757575 !important;;">
    <span>Distribuzione Tipi di Reclamo negli ultimi 3 anni</span>
</div>

        $.plot($("#bar-tipoReclamo"), barData, {
                series: {
                    bars: {
                        show: true,
                        barWidth: 0.13,
                        order: 1
                    }
                },
                valueLabels: {
                    show: true
                },
                xaxis: {
                     ticks: [[0,currentYear-2],[1,currentYear-1],[2,currentYear]]
                },
                legend: {
                    container: '.flc-bar',
                    noColumns: 0,
                    backgroundColor: "white",
                    lineWidth: 0
                },
                grid: {
                    hoverable: true,
                    clickable: true
                },
                tooltip: true,
                tooltipOpts: {
                 content: " %y,%s  " ,
                    shifts: {
                        x: 20,
                        y: 0
                    },
                    defaultTheme: false
                }
            });