Centering PayPal Button On Wordpress

Hey guys, I was wondering if any of you know how to correctly center a PayPal button on Wordpress. It seems like such a basic thing to do, but I have had zero success with the methods that I know.

The paypal button contains a dropdown menu so that means the button is in a < table > format. This eliminates some methods of centering.

I have attempted the following inline CSS with no success.

< div style=“margin:0px auto; width:400px;” > < /div >

< table align=“center” >

< div style=“text-align:center;” > < /div >


Does anyone know a solution to this?

1 Like

Are you correctly targeting the paypal element? You probably need a plugin to handle custom js/css and then target the element.

It needs to be loaded last otherwise the element will correct itself since it also uses its own css.

1 Like

Thanks for your reply @dddd

Yes I am correctly targeting the paypal element.

I have tested the centered paypal button on JSFiddle and its centering without any problems. It just seems when I enter the code into Wordpress it does not work.

Here is the code I am entering into wordpress.
https://jsfiddle.net/ro8edL26/

I am starting to think it may be the default CSS of the theme conflicting.

I don’t know if this makes a difference, but i usually use a custom css for handling things.

https://jsfiddle.net/ro8edL26/2/

The thing about wp is they have a strange issue when you try to input things using the html editor. They sometimes strip things away.

I would then use a shortcode plugin if nothing else works.

If you want to eliminate the theme being the reason, i would then switch it to the default theme or just create a staging site just for all the other test without messing a live site.

PROBLEM SOLVED![quote=“dddd, post:4, topic:2667”]
The thing about wp is they have a strange issue when you try to input things using the html editor. They sometimes strip things away.
[/quote]

Thanks to what you said, it got me thinking. Since WP does not like certain things entered into the HTML editor, I thought, well why not see if I can center it using settings that WP offers. I tried going into the view mode, and selecting the entire PayPal table and tried to center it. I had no success. I then selected each part of the PayPal button and hit the center text button and surprisingly is centered everything correctly!

The weird part is when I enter the HTML code into Jsfiddle it does not appear centered, but it does on WordPress which is all I care about right now. I have literally spent the entire day trying to figure it out!

Haha. Coding is a whack job afterall. Sometimes idk why it works but hey as long as it works. :joy:

2 Likes

I could not agree more with you!

There are so many variables and compatibility issues its ridiculous! But the moment when you finally fix something which aint working right is the best feeling in the world.

Thanks again for chiming in!