0

I'm working on this page and trying to center the Add to Cart (submit) button within it's parent div. I've tried various methods but can't get it to move at all.

I've tried form.cart { margin:auto; text-align:center; } and .single_add_to_cart_button { margin:auto; text-align:center; }, neither of which do anything.

Thanks in advance for any advice.

user994585
  • 661
  • 3
  • 13
  • 28
  • possible duplicate of [why won't this css button center inside div?](http://stackoverflow.com/questions/20756662/why-wont-this-css-button-center-inside-div) – JamesENL Dec 08 '14 at 03:23
  • You have `float: left` applied to the button. Remove it – aug Dec 08 '14 at 03:23
  • Please include the relevant HTML here, as well. You will get much better, as well as faster responses. – rfornal Dec 08 '14 at 03:28

4 Answers4

2

Just remove float: left from the button with a class of single_add_to_cart_button

jmore009
  • 12,863
  • 1
  • 19
  • 34
  • Thanks. I removed the `float:left` from that button, but it still won't seem to center... Am I missing something? – user994585 Dec 08 '14 at 03:49
  • did you update that page? cause I still see the float there. It's on `.button`. If this is needed for other buttons you can add `float: none` on `.single_add_to_cart_button` to override it – jmore009 Dec 08 '14 at 03:52
1

try make text align center on parent (form)

form.cart {
    text-align: center;
}
0
.single_add_to_cart_button { float:none; }
rnrneverdies
  • 15,243
  • 9
  • 65
  • 95
Stef
  • 341
  • 1
  • 8
0

as jmore009 said remove float:left; and then add margin:0 auto 0 auto !important; to class of single_add_to_cart_button

Nima Derakhshanjan
  • 1,380
  • 9
  • 24
  • 37