Custom visual displays wrong once published (problem only on Internet Explorer)

[Anonymous]

I made a custom visual, tested on Chrome everything works fine, debug or published result.

I have test it on IE, debug session displays perfectly fine but when I publish it into the actual report, the ys for text are shifted, see screenshot below.

Has anyone experience this?

Here are examples of my code for the ys:

Mainmeasure: {
                    text: '(blank)',
                    attributes: [
                        {
                            key: 'x',
                            value: `${viewportWidth / 2}px`
                        },
                        {
                            key: 'y',
                            value: MainMeasureY
                        },
                        {
                            key: 'text-anchor',
                            value: 'middle'
                        },
                        {
                            key: 'alignment-baseline',
                            value: 'alphabetic'
                        }
                    ],
                    styles: [
                        {
                            key: 'font-size',
                            value: `${MainValue_INFCFontSize}px`
                        },
                        {
                            key: 'font-family',
                            value: 'Oswald'
                            //value:'BebasNeue Regular'
                        },
                        {
                            key: 'fill',
                            value: MainValue_INFCFontColor
                        },
                        {
                            key: 'font-weight',
                            value: 'bold'
                        }
                    ]
                },