Formular input zerstört design im IE

[inox]

Sehr geehrte Community

ich bin derzeit dabei meine neue seite zu basteln und habe ein riesen Problem. Eigentlich sollte es ein kleines Problem sein nur hält es mich schon zwei wochen auf.. Am besten ihr guckt euch das erstmal an.

Im Firefox
Im Internet Explorer

Ich krieg das einfach nicht gebacken.. Hab auch schon paar mal gegen meinen armen monitor getreten aber auch das hat nichts gebracht XD

Hier der Code:
CODE <table width="904" border="0" align="center" cellpadding="0" cellspacing="0" style="height:34px;">
<tr>
<td width="82"><img src="<?=SCRIPT_ROOT?>images/preisvergleich.gif" width="82" height="34" alt=""></td>
<td width="88"><img src="<?=SCRIPT_ROOT?>images/elektronik.gif" width="88" height="34" alt=""></td>
<td width="147"><img src="<?=SCRIPT_ROOT?>images/computer.gif" width="147" height="34" alt=""></td>
<td width="116"><img src="<?=SCRIPT_ROOT?>images/haus.gif" width="116" height="34" alt=""></td>
<td width="88"><img src="<?=SCRIPT_ROOT?>images/fotografie.gif" width="88" height="34" alt=""></td>
<td width="98"><img src="<?=SCRIPT_ROOT?>images/auto.gif" width="98" height="34" alt=""></td>
<td width="56"><img src="<?=SCRIPT_ROOT?>images/mode.gif" width="56" height="34" alt=""></td>
<td background="<?=SCRIPT_ROOT?>images/search_bg.gif" width="229" height="34">

<table width="100%" height="34" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="120" height="34">
<form action="<?=SCRIPT_ROOT?>search_products.<?=EXTENSION?>" method="GET" name="formSearch" id="formSearch">
<table width="223" border="0" cellspacing="0" cellpadding="0">
<tr><td style="width:15px;">  </td>
<td align="left"><input name="searchText" value="Produktsuche" type="text" style="font-family:Verdana, Arial, Helvetica, sans-serif; font-size:11px;border:1px solid #C23500; height:13px; text-align:left; vertical-align:middle; width:170px;"></td>
<td><input type="image" src="<?=SCRIPT_ROOT?>images/suchbutton.gif" name="btnGo2" border=0 alt="" align="absmiddle" />
</td><td style="width:100%;"></td>
</tr>
</table>
</form>

</td>
</tr>
</table>

</td>
</tr>
</table>


Ihr seit meine letzte Hoffnung, stehe kurz davor das Design komplett zu ändern. Ich hoffe ihr könnt mir helfen

Mit freundlichen Grüßen
inoX

 

[inox]

Hat keiner eine idee?

mfg
inoX

 

[Sebamueller]

CODE <td align="left"><input name="searchText" value="Produktsuche" type="text" style="font-family:Verdana, Arial, Helvetica, sans-serif; font-size:11px;border:1px solid #C23500; height:13px; text-align:left; vertical-align:middle; width:170px;"></td>


Ersetzen mit:


CODE <td align="left" style="line-height: 34px"><input name="searchText" value="Produktsuche" type="text" style="font-family:Verdana, Arial, Helvetica, sans-serif; font-size:11px;border:1px solid #C23500; height:13px; text-align:left; vertical-align:middle; width:170px;"></td>


Hab jetzt nur schnell geschaut, probiers mal

 

[inox]

@ Sebamueller,
leider hat das auch nichts gebracht..

Woran könnte es den sonst liegen? Ich versteh das einfach nicht...

mfg
inoX

 

[Thomas Teufel]

Hallo inoX!

Da ich schon sehr viele Probleme mit IE-bedingten Browserinkompatibilitäten hatte kann mich fast nichts mehr erschüttern.

Dein Problem sollte zu beheben sein, wenn du dem form-tag folgendes style-Attribut gibst:
style="display:inline;"

Der IE bricht meiner Erfahrung nach die Zeilen von Block-Elementen nicht nur um, sondern fügt danach auch noch eine Leerzeile ein.

lg
Thomas