Remove the overlap of the gridlines on markers

问题:

I'm doing an areaspline chart where my gridlines on the x-axis are of the same colour as the background but different from the markers and the "information" background.

Here's a fiddle to exemplify: JSfiddle

I wanted the markers (and only the markers, the rest of the are would still have the gridline) to be "in front" of the gridlines so it's not cut in half.

xAxis: {
        ...
        gridZIndex: 4,
        ...

I have tried moving the gridZIndex, the problem is that when I make it a value smaller, the part in grey stops having the grid which is not the effect wanted (although the markers stop being cut in half.

Is what I'm trying to do possible?

Without modifying the DOM it's not possible, so that's what I ended up doing. So, after closing the highcharts, using jquery you can do this:

$('.highcharts-markers').insertAfter($('.highcharts-grid')[1]);

Meaning that I moved the white markers on top of the grid. Problem solved.
(more suggestions to get around this are in the comment in this question)