Grow your CSS skills. Land your dream job.

Image With PayPal Button Float Issue

  • MBM
    # April 27, 2013 at 10:05 pm

    Before adding code for PayPal buttons I have two rows with 3 images on each row. I’ve added PayPal button code and put it in a container to position it but only the first button floats under the image, the rest are a mess. I have tried clearing the divs and playing around with positioning. The code validates.

    shoes



    Sizes





    div.row1 {margin-left:260px;}
    div.row2 {margin-left:260px;}

    div.ppal {
    float:left;
    margin-top:-40px;
    margin-left:10px;
    }

    http://mbmitservices.co.uk/pcommerce/index.html

    # April 28, 2013 at 5:49 am

    What is it supposed to look like?

    Oh….and do you have to use a table?…I suspect that is the problem.

    MBM
    # April 28, 2013 at 8:42 am

    Yes the problem is the table but it’s PayPal generated code so I can’t edit it. I’ve removed a border tag for validation purposes but don’t want to mess about with the table code. After a lot of fiddling about I have got it working. I’m not sure if the way I’ve done it is good practice.

    shoes


    Please Select Size




    div.row1 {margin-left:260px;}

    div.ppal {
    float:left;
    margin-left:-260px;
    margin-top:340px;
    margin-bottom:20px;
    }

    ![Alt text](http://mbmitservices.co.uk/pcommerce/images/screenshot.png “PayPal ecommerce template”)

    # April 30, 2013 at 12:36 am

    I made an example from Codepen http://codepen.io/anon/pen/jhFwp
    Is it like what you have wanted?

Viewing 4 posts - 1 through 4 (of 4 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".