Markers, Popups, and offsets

[nonoumasy]

Just wondering any good practice on how to center the Markers and Popups as well as using offsets to achieve said goal.
On my app, the popups vary in their distance and alignment from the markers. Note: my markers have variable width and heights so I suspect this is part of the reason that it looks as if the popups are not center-aligned to the markers.

Is there any way to center-align markers and popups on the coordinates?

You can check it out here:
https://timelinesapp.netlify.app/timeline/5fbd21ad78fff5f77ae084fd
api is deployed on heroku so it might be sleeping.

[nonoumasy]

I figured it out.
The markers and popups are anchored top left per this issue...mapbox/mapbox-gl-js#2900.

So I tried the suggested solution of using marginLeft based on the image size and then dividing it by two. Although centering the anchor would be ideal.