Schönen guten Tag!
Beim Designen einer Seite habe ich festgestellt, dass der Internet Explorer immer eine 1 Pixel breite margin oberhalb und unterhalb eines Input-Feldes einfügt.
Hier der Testcase:
<html>
<head>
<style type="text/css">
div { padding:0px; margin:0px; background-color:#ff0000; }
input { padding:0px; margin:0px; }
</style>
</head>
<body>
<form><div bgcolor="#ff0000"><input type="text"></div></form>
</body>
</html>
Beim IE ist über und unter dem Inputfeld noch ein 1 Pixel breiter Streifen des roten Hintergrundes zu sehen. Mozilla hingegen rendert es so, wie ich das erwarten würde.
Fügt man für das Input ein margin-top:-1px;margin-bottom:-1px; ein, dann gehts beim IE - aber das ist natürlich nicht im Sinne des Erfinders.
Ist dieses Phänomen schon mal aufgefallen und weiß jemand vielleicht einen Workaround, der auf beiden Browsern geht?
Merci,
Jan