nicht angemeldet
hi, ich habe folgenden (auf das Wesentliche reduzierten) Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//DE">
<html>
<head>
<style type="text/css">
div, span, p, td { font-family:Tahoma,Arial,sans-serif;
font-style:normal;
font-size:13px;
font-
}
form {
margin: 0;
}
</style>
</head>
<body style="margin:0px;">
<div style="width:100%; background-color:#FF0000;">
<div style="text-align:center;"><img src="http://www.the-edge.ws/schnitzler/images/covers/gelb.jpg" border="0" alt="" height="181" width="882" /></div>
</div>
<div style="width:100%; background-color:#00FF00; height:50px;"><div style="text-align:center;"><img src="http://www.the-edge.ws/schnitzler/images/covers/gelb.jpg" border="0" height="63" width="32" /><span style="line-height:63px; margin-top:10px; vertical-align:top">abc</span><img src="http://www.the-edge.ws/schnitzler/images/covers/gelb.jpg" border="0" height="63" width="55" /></div></div>
<div style="width:100%; background-image:url('#0000FF')">
<div style="margin:auto; width:820px; overflow:visible;">
<table width="100%" border="0" style="margin:0px; background-color:#999900">
<tr><td style="width:182px; overflow:visible; vertical-align:top;">MENÜ</td>
<td style="width:638px; overflow:visible; vertical-align:top; background-color:#009999">Content</td></tr>
</table>
</div>
</div>
Ich will in der Mitte des Textes (bei abc) später dann ein Input-Element anzeigen, dass ca. 10px von oben beginnen soll. Allerdings interpretieren IE und Mozilla das "line-height:63px; margin-top:10px; vertical-align:top" auch unterschiedlich.
Habt ihr eine Idee, wie ich das hinbekomme?
Außerdem zeigt mir jeder Browser das mittlere DIV höher an als die Bilder (obwohl beides 63px hoch ist). Wisst ihr, wo der Fehler liegt und wie ich die Lücke weg bekomme?
Danke!!!
P.S. ich habe allen Code innerhalb der DIVs auf 1 Zeile, sodass Lücken durch Tabulator/Enter wie im o.g. Code ausgeschlossen sind; nur zum übersichtlicher darstellen. (Das Bild ist ein Dummybild, um das Problem zu verdeutlichen)