I need to center-align a button in a login form and I can't manage to do it. The reason for that is that there is a css property inherited from div .page (text-align: left). I tried to assign the property text-align:center to the element itsef, but there is no effect, and the .page property seems to prevail over it. I saw that the < div class="page" comes from 1column.phtml, so it affects all my page.

Anyone knows how could I center-align the button?


1 Answer 1


Here's your solution: http://jsfiddle.net/7Laf8/

Basically, place your button into a div with centred text:

<div class="wrapper">
    <button class="button">Button</button>

With the following styles:

.wrapper {
    text-align: center;

.button {
    position: absolute;
    top: 50%;

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.