Centering an image

  • Hello! I am working on this page: https://www.thelyonsshare.org/fallreset2014.

    The “Buy Now” buttons at the bottom are too large, and I’d like to either center them or left-align, just make them smaller rather than spanning the page.

    Here is the code for the last bit of text and the button:

    <ul>
<li>The basic Fall Rest, for Spring Reset participants only: $29.99
<form name="PrePage" method = "post" action = "https://Simplecheckout.authorize.net/payment/CatalogPayment.aspx"> <input type = "hidden" name = "LinkId" value ="454e09a5-91b7-4950-9d8a-6e05bb4327a5" /> <input type = "image" src ="//content.authorize.net/images/buy-now-gold.gif" /> </form></li>
Can you help me add something to fix the picture?  Thank you SO MUCH in advance!</ul>

Viewing 7 replies - 1 through 7 (of 7 total)

  • It looks like your Buy Now Gold buttons are working. Did you resolve this issue or are you still needing assistance with it?

    add the below code in stylesheet to reduce the size of buy now button:

    .post-12703 input{
    width:30%!important;
    }

    (I have reported how mangled the layout of this thread has become)

    This is a tough one.
    The problem is the width:100%;
    found at style.css line 354

    input, select, textarea {
    background-color: #fff;
    border: 4px solid #add69e;
    color: #079e3d;
    font-size: 1.1rem;
    letter-spacing: 1px;
    padding: 1rem;
    text-transform: uppercase;
    width: 100%;
}

    Suggest a fix like this:

    .jpibfi_container ol input {
 width:auto;
}

    This will have minimal impact elsewhere.

    Thread Starter megalin

    (@megalin)

    @cmshelplive, that worked perfectly! Thank you so much!

    Ah looks like you edited your first post. I’m glad others were able to help! ??

    Thread Starter megalin

    (@megalin)

    @cmshelplive, I want to do this same thing for this page: https://www.thelyonsshare.org/2015reset/
    I am not sure how to find the post number so I can repeat this code in the stylesheet:
    .post-12703 input{
    width:30%!important;
    }

    Thank you!!!

    Thread Starter megalin

    (@megalin)

    Nevermind, I got it, thank you!

Viewing 7 replies - 1 through 7 (of 7 total)
  • The topic ‘Centering an image’ is closed to new replies.