super newbie tring to center a generated paypal button [Archive]

Blackmore

03-31-2012, 08:49 AM

Hey guys I've been struggling with this all day, goggling everything, and just can't seem to work it out.

Below is a bit of code that displays a pay pal button for my site, but it aligns to the left. I want to center it if it is possible. I tired googling this and the responses where to put it in some DIV code, but what ever I tried didn't work.

Can any of you smart people help me...

<form action="https://www.paypal.com/cgi-bin/webscr" method="post">
<input type="hidden" name="cmd" value="_s-xclick">
<input type="hidden" name="hosted_button_id" value="9GH3EVPWDVTWU">
<input type="image" src="https://www.paypalobjects.com/en_AU/i/btn/btn_buynowCC_LG.gif" border="0" name="submit" alt="PayPal — The safer, easier way to pay online.">
<img alt="" border="0" src="https://www.paypalobjects.com/en_AU/i/scr/pixel.gif" width="1" height="1">
</form>

ashstyx

03-31-2012, 11:38 AM

You can use css

example of css code:

.paypal1
{
position:absolute;
right:0%;
left:33%;
width:150px;
margin-top:15%;
}

this will make it go from the left side 33% and from the top 15% you can also use px (pixels) but i like %

the code you use is

<html>
<head>
<link rel="stylesheet" href="paypal.css" type="text/css" />
</head>
<body>
<div class="paypal1">
<form action="https://www.paypal.com/cgi-bin/webscr" method="post">
<input type="hidden" name="cmd" value="_s-xclick">
<input type="hidden" name="hosted_button_id" value="9GH3EVPWDVTWU">
<input type="image" src="https://www.paypalobjects.com/en_AU/i/btn/btn_buynowCC_LG.gif" border="0" name="submit" alt="PayPal — The safer, easier way to pay online.">
<img alt="" border="0" src="https://www.paypalobjects.com/en_AU/i/scr/pixel.gif" width="1" height="1">
</form>
</div>
</body>
</html>

the .paypal can be any word you want so you could have multiple css codes on one page
The bits in red are the important bits you need on your html code, the bit in Blue is the css file its a text doc but saved as "whatevernameyouwant.css"

.paypal1
{
position:absolute;
right:0%;
left:33%;
width:150px;
margin-top:15%;
}

.test1
{
position:absolute;
right:0%;
left:33%;
width:150px;
margin-top:15%;
}

.test2
{
position:absolute;
right:0%;
left:33%;
width:150px;
margin-top:15%;
}

as long as the <div> has the desired name like <div class="test1"> your content </div>

<link rel="stylesheet" href="paypal.css" type="text/css" /> the href="paypal.css" is the name of the css file

hope this helps