Tooltip is squished when in horizontally scrolling page

[GeoMarkou]

In our application we have a very long horizontally scrolling page (week scheduler). Any tooltips that appear after scrolling to the right are squished. Replication:

Go go the example http://react-component.github.io/tooltip/examples/placement.html

In your browser's debugging tools change one of the tooltips to be longer so the squishing is more obvious.

Add this CSS

.example {
    margin-left: 110vw;
}

You can see that once the content is off the screen to the right the tooltip is only as wide as the longest word.