how to center "add to cart" button on a mobile

  • Hi, I have Vantage/woo commerce theme and i am having problems centering the “add to cart” button on a mobile device, they are left aligned at the moment.
    I have tried this code in my CSS:

    .woocommerce #page-wrapper .button {
    background: rgba(0, 0, 0, 0) -moz-linear-gradient(center bottom , #dfdfdf 0%, #ffffff 100%) repeat scroll 0 0;
    border-color: #d2d2d2 #c3c3c3 #9f9f9f;
    border-radius: 3px;
    border-style: solid;
    border-width: 1px;
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.125), 0 1px 0 rgba(255, 255, 255, 0.5) inset;
    color: #343538;
    cursor: pointer;
    line-height: 1;
    text-decoration: none;
    text-shadow: 0 1px 0 rgba(255, 255, 255, 0.8);
    width: auto;
    }

    but nothing works, any help would be appreciated, thanks

Viewing 6 replies - 16 through 21 (of 21 total)
  • Thread Starter Jods

    (@jods)

    I also found the demo mode thank you.

    Should I use a wider max-width media query for landscape mode? Would that work?

    Thanks

    Thread Starter Jods

    (@jods)

    Hi Misplon, I added this code: @media (max-width: 480px) {
    body.responsive.woocommerce-page #container ul.products li.product {
    text-align: center;
    }
    }

    and that fixed the landscape problem, so alll that is all fixed now, thank you very much for your patience and all your expertise help, its greatly appreciated.

    I have a couple more issues that i need help with as well, would you prefer I start a new thread?
    Thank You

    Super ??

    Yes, please, start a new thread.

    Thanks

    Thread Starter Jods

    (@jods)

    Apologies the code was this one, I grabbed the wrong one:

    @media (max-width: 568px) {
    body.responsive.woocommerce-page #container ul.products li.product {
    text-align: center;
    }
    }

    Thread Starter Jods

    (@jods)

    Will do, Thank You

    For sure. Yes, you can increase the breakpoint as required.

Viewing 6 replies - 16 through 21 (of 21 total)
  • The topic ‘how to center "add to cart" button on a mobile’ is closed to new replies.