[SOLVED] Browser Consistency Problems with Login Form? One field much longer than other?

[spiceydog]

I have a simple login form on my webpage (as seen below) that looks and works just fine in some versions of FF (only on PC), Opera 9.5, and Safari (Although there are a few minor problems in even these).

 

The best way I can explain these problems are with pictures which I have posted below with a description. Here is a picture of about what I want (viewed in safari):

Although almost what we want the only slight problem is the height of the image needs to be changed a little. When we do change it the valign gets all screwey and it's always a few pixels above or below it.

 

Firefox 2.0.0.16 on Mac:

 

Internet Explorer 6 on PC:

 

 

Now here is the relevant source code:

<form action="<?php echo $_SERVER['PHP_SELF']?>" method="post"><table id="Table_01" width="100%" height="60" border="0" cellpadding="0" cellspacing="0">
<tr>
	<td width="10">
		<input type="text" id="username" name="username" onFocus="clearu();" value="username" style="font-size:15px" size="15"></td>
	<td width="69" rowspan="2" align="center" valign="top">
<input type="image" value="Login" name="submit" src="images/login.jpg">
</td>
  <td width="137" rowspan="2" class="style2"><a href="register.php">register account</a><br>
      <br>
      <a href="recovery.php">lost your password?</a>
      </td>
</tr>
<tr>
	<td width="10"><input id="password" type="password" onFocus="clearp();" name="pass" value="password" style="font-size:15px" size="15"></td>
  </tr>
</table>
</form>

 

Is there any easier way going about making this table and such? If not what is going on in those two pictures that are so messed up?

 

Thanks in advance!

[Pyro]

Hi,

 

Have if i was you, i would re make them so the username and passwrod were in the same part, and the log in in a new td and then the other options in another td and rows.