problema allineamento opera

[ThePenguin]

salve a tutti,

ho un problemino nell'allineamento verticale di un form dati con opera browser.
duqnue questo allineamento mi corrisponde perfettamente su IE, Mozilla, Firefox Netscape, ma su opera mi da uno spazio di x pixel che non capisco.
dunque:

il codice del foglio di stile inquisito è il seguente:

/*form dati accesso clienti */
.areaclienti {width: 227px;
  height: 90px;
  margin: 0px;
  padding: 0px;
  vertical-align: top;
  text-align: left;
  background: url(zona2_a.png) no-repeat}

spaziatura5 {width: 227px;
  height: 5px}

.areainput1 {width: 227px;
  height: 20px; 
  padding-left: 30px;
  text-align: left;
  vertical-align: baseline;
  font-weight: normal;
  font-family: Trebuchet MS, Verdana, Arial, Tahoma;
  color: #ffffff;
  font-size: 11px}

.areainput2 {width: 227px;
  height: 20px; 
  text-align: left;
  vertical-align: baseline;
  padding-left: 30px;
  font-weight: normal;
  font-family: Trebuchet MS, Verdana, Arial, Tahoma;
  color: #ffffff;
  font-size: 11px}
  
.campo1 {width: 104px;
  height: 13px;
  border: 0px solid #ffffff; 
  font-weight: normal;
  font-family: Trebuchet MS, Verdana, Arial, Tahoma;
  color: #1b324d;
  font-size: 10px} 

.campo2 {width: 94px;
  height: 13px;
  border: 0px solid #ffffff; 
  font-weight: normal;
  font-family: Trebuchet MS, Verdana, Arial, Tahoma;
  color: #1b324d;
  font-size: 10px} 
  
.pulsante {width: 227px;  
  height: 20px; 
  padding-left: 127px}  

.pulsante img{vertical-align: top}

il codice della pagina, solo quello legato al form è il seguente:

<table cellpadding="0" cellspacing="0" class="corpopagina">
 <tr>
  <td class="areaclienti">
   	
  </td>
  <td class="areatesti" rowspan="2">
   <div name="testi" class="testinobarra">
   
   </div>
  </td>
 </tr>
 <tr>
  <td class="areamenu">
   [img]zona2_c.png[/img]
   <MAP NAME="zona2_c.png">
	<AREA SHAPE="RECT" COORDS="39,28,144,40" HREF="hardware.asp">
	<AREA SHAPE="RECT" COORDS="39,46,139,58" HREF="internet.asp">
	<AREA SHAPE="RECT" COORDS="40,64,136,76" HREF="intranet.asp">
	<AREA SHAPE="RECT" COORDS="40,82,140,94" HREF="software.asp">
	<AREA SHAPE="RECT" COORDS="40,101,116,112" HREF="web.asp">
	<AREA SHAPE="RECT" COORDS="40,120,170,130" HREF="sistemi.asp">
	<AREA SHAPE="RECT" COORDS="39,138,176,148" HREF="consulenze.asp">
	<AREA SHAPE="RECT" COORDS="38,154,152,166" HREF="assistenza.asp">
	<AREA SHAPE="RECT" COORDS="38,173,100,184" HREF="servizi.asp">
	<AREA SHAPE="RECT" COORDS="38,191,146,202" HREF="preventivi.asp">
   </MAP>
  </td>
 </tr>
</table>

il file di inclede contiene questo:

<table>
 <form method="post" action="accessoclienti.asp" name="areaclienti">
 <tr>
  <td class="spaziatura5"></td>
 </tr> 
 <tr>
  <td class="areainput1">User-Id<input type="text" name="user" class="campo1"></td>
 </tr>
 <tr>
  <td class="spaziatura5"></td>
 </tr> 
 <tr>
  <td class="areainput2">Password<input type="password" name="psw" class="campo2"></td>
 </tr>
 <tr>
  <td class="spaziatura5"></td>
 </tr> 
 <tr>
  <td class="pulsante"><input type="image" src="avanti.png" value="Submit" align="top" alt="Entrata Area Clienti"></td>
 </tr>
 </form>
</table>

è il risultato lo si può vedere in http://www.ro76.it/home.asp
Ovviamente da raffrontare fra opera e gli altri browser x capire cosa vi sia di errato.



Grazie mille a tutti!

[ThePenguin]

ok ora la situazione è migliorata... anche su opera l'allineamento in alto sembra esserci tuttavia però a questo punto ho un altro problema..

il codice della pagina è diventato:

  <td class="areaclienti">
   <div class="areainput1">Userid<input type="text" name="user" class="campo1"></div>
   <div class="areainput2">Password<input type="password" name="psw" class="campo2"></div>
   <div class="pulsante">"><input type="image" src="avanti.png" value="Submit" align="top"></div>
  </td>

e il problema è che come faccio a diventare tutto questo un form valido e che mi punti passando i valori di user e psw alla pagina accessoclienti.asp?

grazie

mentre la parte del foglio di stile con le classi collegate è:

/*form dati accesso clienti */
.areainput1 {margin-top: 10px;
  height: 25px;
  width: 195px;
  padding-left: 30px;
  padding-top: 0px;
  padding-bottom: 0px;
  text-align: left;  
  vertical-align: middle;
  font-weight: normal;
  font-family: Trebuchet MS, Verdana, Arial, Tahoma;
  color: #ffffff;
  font-size: 11px}

.areainput2 {margin: 0px;
  height: 25px;
  width: 195px;
  padding-left: 30px;
  padding-top: 0px;
  padding-bottom: 0px;
  text-align: left;  
  vertical-align: middle;
  font-weight: normal;
  font-family: Trebuchet MS, Verdana, Arial, Tahoma;
  color: #ffffff;
  font-size: 11px}

.pulsante {margin: 0px;
  height: 28px;
  width: 225px;
  border: 0px solid #ffffff}

.campo1 {width: 110px;
  height: 13px;
  border: 0px solid #ffffff; 
  font-weight: normal;
  font-family: Trebuchet MS, Verdana, Arial, Tahoma;
  color: #1b324d;
  font-size: 11px}

grazie

[ThePenguin]

nessun aiutino..?
ragazzi è moltio importante oltre che urgente...