How do I centre absolutely positioned content of unknown width?

Pushing the element left by 50% of its width and then translating it horizontally by 50% has worked for me.

.element {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
} 

I found the concept in the following link, and then I translated to fit my horizontal align needs: https://gist.github.com/colintoh/62c78414443e758c9991#file-douchebag-vertical-align-css