PDA

View Full Version : Form code (paypal) messing up my layout


dsnyder
04-10-2007, 10:35 PM
When I paste in the code provided by Paypal to make the link work it totally messes up my header. I add the code to the Ď View Cartí button and all is destroyed. The 'Contact' button is pushed down into my banner. Before the form code is added things look like : Home | View Cart | Contact

http://cellocelli.com/basiclayout1.htm

Any ideas? Iíve messed around with css properties for the header but have had no luck. Am I pasting the <form target code incorrectly?

<div id="header">
<p><img src="Images/Buttons/Home.gif" /><form target="paypal" action="https://www.paypal.com/cgi-bin/webscr" method="post">
<input type="hidden" name="cmd" value="_cart"><input type="hidden" name="business" value="dsnyder@phoenixensemble.com">
<input type="image" src="Images/Buttons/ViewCart.gif" border="0" name="submit" alt="View Cart">
<input type="hidden" name="display" value="1"></form><img src="Images/Buttons/Contact.gif" /></p>
</div>
Css #header {
background-color:none;
padding: 0px;
margin: auto;
width: 740px;
height:40px;
}

#header p{
text-align:right;
margin:0;
}

dsnyder
04-11-2007, 03:54 PM
I was able to fix the alignment issue by adding the following to the <head> :
<style>
table tr td {
vertical-align:middle;
}
form {
display:inline;
}
</style>
Canít figure out
why the table holding my header buttons is spilling over my banner (in FF it spills over on top, IE7 it fall behind)
how to change the bg color of the table to match the body color. Simply adding the correct color property isnít being honored. #header {
background-color:none;
padding: 0px;
margin: auto;
width: 740px;
height:40px;
}

#header p{
text-align:right;
margin:0;
}
<table border="0" align="right" cellpadding="0" cellspacing="0" bgcolor="e2dfa8">
<tr>
<td><img src="Images/Buttons/Home.gif" /></td>
<td><form target="paypal" action="https://www.paypal.com/cgi-bin/webscr" method="post">
<input type="hidden" name="cmd" value="_cart"><input type="hidden" name="business" value="dsnyder@phoenixensemble.com">
<input type="image" src="Images/Buttons/ViewCart.gif" border="0" name="submit" alt="View Cart">
<input type="hidden" name="display" value="1"></form></td>
<td><a href="mailto:dsnyder@cellocelli.com"><img src="Images/Buttons/Contact.gif" border="0" /></a></td>
</tr>
</table>
any thoughts?