Highcharts - Long multi-line y axis labels causing following label to be removed

Question

I have a need for some very long multi line labels on the y axis of a highcharts bar chart.

My issue is that long, multi-line labels cause the following label to be removed - probably an internal overlap failsafe of some kind.

I am at the point where I increased the label width so that i could control the word wrapping myself with line breaks (the internal word wrap also yields the same issue i am having with missing labels.)

I'd love to be able to turn off this feature and deal with the overlap myself.

Example:

chart options:

{
    "colors": [
        "#00AEEF"
    ],
    "credits": {
        "enabled": false
    },
    "chart": {
        "type": "bar"
    },
    "tooltip": {},
    "plotOptions": {
        "column": {
            "pointPadding": 0.2,
            "borderWidth": 0
        },
        "series": {
            "borderWidth": 0,
            "dataLabels": {
                "enabled": true,
                "format": "{point.y:.1f}%"
            }
        }
    },
    "series": [
        {
            "showInLegend": false,
            "data": [
                [
                    "this is a pretty long label <br/>that will most likely cause the next<br/> row not to appear",
                    70
                ],
                [
                    "this is a pretty long label <br/>that will most likely cause the next<br/> row not to appear",
                    62.5
                ],
                [
                    "this is a pretty long label <br/>that will most likely cause the next<br/> row not to appear",
                    41.25
                ],
                [
                    "this is a pretty long label <br/>that will most likely cause the next<br/> row not to appear",
                    26.25
                ],
                [
                    "this is a pretty long label <br/>that will most likely cause the next<br/> row not to appear",
                    18.75
                ],
                [
                    "this is a pretty long label <br/>that will most likely cause the next<br/> row not to appear",
                    11.25
                ],
                [
                    "this is a pretty long label <br/>that will most likely cause the next<br/> row not to appear",
                    7.5
                ],
                [
                    "this is a pretty long label <br/>that will most likely cause the next<br/> row not to appear",
                    3.75
                ],
                [
                    "this is a pretty long label <br/>that will most likely cause the next<br/> row not to appear",
                    3.75
                ]
            ]
        }
    ],
    "xAxis": {
        "minorGridLineWidth": 0,
        "minorTickLength": 0,
        "tickLength": 0,
        "type": "category",
        "labels": {
            "overflow": "justify",
            "style": {
                "color": "#525151",
                "fontSize": "12px",
                "lineHeight": "10%",
                "fontFamily": "Helvetica Neue, Helvetica ,Helvetica,Arial,sans-serif",
                "width": "999px"
            },
            "y": -10
        }
    },
    "yAxis": {
        "min": 0,
        "title": {
            "text": "Percent (%)"
        }
    }
} 

Answer 1

Simply set step: 1, see: http://jsfiddle.net/Yrygy/135/

Docs.