Forms Wiggin Out

[cavey5]

This is a simple html question. I am using images as form elements but when I do, it wigs out my table spacing. I guess I can use DIV tags but I am curious to solve this with html tables.

My code with forms:

[pre]
echo "
<tr>
<td width=\"20\" height=\"20\" align=\"left\" valign=\"middle\"><font class=\"cart\">&nbsp;&nbsp;($qty)</font></td>
<td width=\"180\" height=\"20\" align=\"left\" valign=\"middle\"><font class=\"cart\">&nbsp;&nbsp;$description</font></td>
<td width=\"70\" height=\"20\" align=\"right\" valign=\"middle\"><font class=\"cart\">$itemtotal</font></td>
<td width=\"25\" height=\"20\" align=\"right\" valign=\"middle\">
[color=red]<form name=\"add_one_item\" method=\"post\" action=\"add_one_item.php\">
<input type=\"image\" name=\"plusmark\" src=\"images/main/plus.jpg\">
</form>[/color]
</td>
<td width=\"25\" height=\"20\" align=\"left\" valign=\"middle\">&nbsp;&nbsp
[color=red]<form name=\"rem_one_item\" method=\"post\" action=\"rem_one_item.php\">
<input type=\"image\" name=\"minusmark\" src=\"images/main/minus.jpg\">
</form>[/color] </td>
</tr>
";
}
echo "
<tr>
<td width=\"320\" height=\"6\" bgcolor=\"#639B38\" colspan=\"5\"></td>
</tr>
<tr>
<td width=\"320\" height=\"1\" bgcolor=\"#000000\" colspan=\"5\"></td>
</tr>[/pre]


Here is what it looks like when there are no forms, just unlinked images (the "+" and "-" are small jpgs):

[img]http://www.timbercrawler.com/tim/screenshots/sc_ok.jpg[/img]


And here is it when I insert the forms:


[img]http://www.timbercrawler.com/tim/screenshots/sc_notok.jpg[/img]

Any ideas what I can do to bring it all back in line?

[AndyB]

Style the forms to get rid of the default spacing around them might solve it.

[code]<form style='margin:0px;' ...... >[/code]

[cavey5]

Okay so I added a form style to the external style sheet and this is what I get, a little better:

form {
border: 0px;
padding: 0px;
}

[img]http://www.timbercrawler.com/tim/screenshots/sc_stillnotok.jpg[/img]

[AndyB]

Just as a matter of interest, why are you even using forms for those, when you could just as well use a standard href link acting the same way as a form with the method GET.  Just change the two scripts that the form posts to so they'll accept a GET via clicked image.  There's no data passed by the form, so a link's as good and simpler.

[code]<form name=\"add_one_item\" method=\"post\" action=\"add_one_item.php\">
<input type=\"image\" name=\"plusmark\" src=\"images/main/plus.jpg\">
</form>[/code]

Is functionally equivalent to this:

[code]<a href='add_one_item.php'><img src='images/main/plus.jpg' ...></a>[/code]

[cavey5]

actually I do have some hidden fields that are being passed; they just were not in my code snippet. I cannot use just an ahref because I cannot pass php variables that way.

<td width=\"10\" height=\"20\" align=\"left\" valign=\"top\">
<form name=\"rem_one_item\" method=\"post\" action=\"rem_one_item.php\">
<input type=\"hidden\" name=\"productid\" value=\"$productid\">
<input type=\"hidden\" name=\"qty\" value=\"$qty\">
<input type=\"image\" name=\"minusmark\" src=\"images/main/minus.jpg\">
</form>
</td>

[cavey5]

Does an html form have an inherent line break built in and if so, how do I escape it?

[AndyB]

The inherent line break with a form was removed through the styling I suggested and you adopted.

You still son't need a form as you can pass data with the URL link like so - just modify add_one_item.php to abstract from the $_GET array, not the $_POST array.

[code]<a href='add_one_item.php?productid=". $productid. "&qty=". $qty. "'><img src='images/main/plus.jpg' ...></a>[/code]

[cavey5]

I don't like sloppy url's... the entire site is done using forms, and I still am curious what the space issue is here? Even when I get the icons to line up the <TR> is still 10. times the ight it should be

[AndyB]

what happens if you take out all the line breaks in the td cell containing the form code?