How to center a button on a page

I have the following code in my button's _postRender function:

myapp.Splash.btnSplashOK_postRender = function (element, contentItem) {
    $(element).find("ui-btn-inner").css({
        "padding-left": "0"
    });
    $(element).css({
        "padding-left": "0",
        "margin-left": "50%",
        "margin-right": "50%"
    });
};

And the result is this:

The padding-left, margin-left, and margin-right are being applied to the div just fine. But the find("ui-btn-inner") doesn't seem to be working at all. And the margin tags don't seem to be taking into account the width of the button in order to get it to the center of the page. What am I missing here?

Note: The accepted answer works perfectly well for this simple case. Though @rockmandew's Third Update provides a more powerful alternative for those wishing to do more complex placements.

To align button add "transform":"translateX(-50%)"

$(element).css({
    "padding-left": "0",
    "margin-left": "50%",
    "transform":"translateX(-50%)"
});