Results 1 to 4 of 4
  1. #1
    Join Date
    Apr 2007
    Posts
    12
    Plugin Contributions
    0

    Default Centering the Add to Cart button

    I want to center the Add to Cart button (or in my case, since I'm in showroom mode, it says "Contact Us" instead of "Add to Cart") when viewing an individual product. I'm using 1.3.9c.

    I found the following in my stylesheet.css file:

    Code:
    /*Shopping Cart Display*/
    #cartAdd {
        float: right;
        text-align: center;
        margin: 1em;
        border: 1px solid #000000;
        padding: 1em;
    }
    I tried commenting out the float:right line, and it just makes the button stretch across the whole screen. Any help or thoughts from a CSS whiz out there? Am I even looking in the right file?

  2. #2
    Join Date
    Feb 2010
    Location
    Arizona
    Posts
    50
    Plugin Contributions
    0

    Default Re: Centering the Add to Cart button

    try float: middle, instead of commenting it out

  3. #3
    Join Date
    Apr 2007
    Posts
    12
    Plugin Contributions
    0

    Default Re: Centering the Add to Cart button

    Quote Originally Posted by 10west View Post
    try float: middle, instead of commenting it out
    No such thing as float: middle? Anyways, I tried it and float:center but they both do not work. I'm guessing I need to add some invisible boxes on the right and left side of the Add to Cart button to make it float properly without stretching.

    Other thoughts out there? If I figure something out on my own I'll update...

  4. #4
    Join Date
    Jul 2005
    Location
    Upstate NY
    Posts
    22,010
    Plugin Contributions
    25

    Default Re: Centering the Add to Cart button

    Float can only be left, right or none. Floated divs automatically shrink to just fit their content width, so if you remove the float, you need to explicitly set the element width if you do not want it 100% width. No invisible boxes are needed; margin: auto; will give the element equal left and right margins, centering it.

 

 

Similar Threads

  1. v151 How do I replace the add-to-cart button with a PayPal *Donate* button?
    By picandnix in forum Addon Payment Modules
    Replies: 7
    Last Post: 29 Apr 2014, 02:52 PM
  2. Change the Add to Cart button to Buy Now button
    By dastudio in forum Customization from the Admin
    Replies: 1
    Last Post: 24 Nov 2010, 09:44 PM
  3. How do I replace the Buy Now button with an Add to Cart button?
    By OrcaSoul in forum Templates, Stylesheets, Page Layout
    Replies: 9
    Last Post: 19 Feb 2010, 05:36 AM
  4. how to add the add-to-cart-button to the new products box on the home page?
    By ebloger in forum Templates, Stylesheets, Page Layout
    Replies: 4
    Last Post: 10 Nov 2008, 10:30 AM
  5. Centering the Add to Cart button
    By Namtaru in forum Templates, Stylesheets, Page Layout
    Replies: 4
    Last Post: 1 May 2008, 11:01 AM

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
disjunctive-egg