CODEWITHSUNDEEP
highcharts
Rand Scullard
Rand Scullard

Reputation: 3565

Highcharts tooltip line height in styled mode

I am trying to increase the line spacing in my Highcharts tooltip in styled mode. I have tried using CSS to set line-height on the .highcharts-tooltip as well as its text and tspan elements:

.highcharts-tooltip,
.highcharts-tooltip text,
.highcharts-tooltip tspan
{
    line-height: 40px;
}

I have also tried using the tooltip.style option:

    tooltip: {
        style: { lineHeight: 40 }
    }

Neither approach has any effect in styled mode. Has anyone managed to make this work?

Upvotes: 1

Views: 399

Answers (1)

ppotaczek
ppotaczek

Reputation: 39069

You need to enable useHTML property for a tooltip.

  tooltip: {
    useHTML: true,
    ...
  }

CSS:

.highcharts-tooltip {
    line-height: 40px;
}

Live demo: http://jsfiddle.net/BlackLabel/893k5cnL/

API Reference: https://api.highcharts.com/highcharts/tooltip.useHTML

Upvotes: 2

Related Questions