[CSS bugs] IE - confusing - me

Status
Nicht offen für weitere Antworten.

JamesT

Erfahrenes Mitglied
Hallo Leute,

langsam wollte ich weg von den aus tabellen basierenden Designs.

Nun habe ich die ersten zeilen quellcode angefangen, und ich stehe an der ersten stelle.
Die Seite wird im IE falsch angezeigt. Was solls, ich benutze ja eh lieber firefox... :)

Naja, ich würde diesen Bug schon gerne weg haben, oder wissen woran es liegt, da ich aber in den letzten 2 stunden bei der suche nach IE CSS bugs (es gibt ja etliche) nichts gefunden habe, oder vielleicht einfach aufgrund meiner unkenntnis nicht weiss woran es liegt, frage ich einfach hier und hoffe das ihr mit weiterhelfen könnt.

Ich muss echt sagen, CSS macht mir jetzt schon Spaß, es wird gerade nur leicht gebrembst durch diesen wahnsinns browser IE..

Aber nun zu meinem Problem:

HTML:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
	<title>Untitled</title>
<style>
body {
	margin: 10px 0px;
	padding: 0px;
	text-align: center;
}
#main {
	margin:0px auto;
	text-align:left;
	width: 819px;
	background-image: url(img/black/mainbg.png);
	background-repeat: repeat-y;
}
#head {
	width: 791px;
	padding: 0px 0px 0px 14px;
}
</style>
</head>
<body>
	<div id="main" align="center">
		<img src="img/black/mainbg_head.png" height="1">
		<div id="head">
			Header<br>
			<br>
			<br>
		</div>
	</div>
</body>
</html>

Und hier die Darstellung:

Einmal im Firefox:

http://www.apex-design.de/ff.jpg

Und im Internet Explorer

http://www.apex-design.de/ie.jpg

Woher kommt dieser Abstand ganz oben? *confused*

Danke im voraus für Eure Hilfe.

Jamest
 
Zuletzt bearbeitet:
Hi,

setz mal die folgende Regel für das Grafikelement im Stylesheet ein, damit es "Block-Level-Charakteristika" erhält:

Code:
#main img { display:block; }
 
Wunderbar, ich danke dir sehr, die erste Hürde ist geschafft.

Kannst du mir sagen, warum der Internet Explorer diesen code benötigt?

Grüße

Jamest
 
Auf Zeilenumbrüche und Einrückungen (Whitespaces) im HTML-Code rund um das img-Element reagiert der IE mit einer Verschiebung der nachfolgenden Elemente.

Dieses Mißverhalten lässt sich mit der empfohlenen Regel abstellen.
 
Status
Nicht offen für weitere Antworten.

Neue Beiträge

Zurück