✔ Darstellung im IE

Status
Nicht offen für weitere Antworten.
W

whiterussian

Erfahrenes Mitglied
Hi!

Ich komm nicht drauf, wieso er mir folgenden Quellcode im IE nicht wie im FF anzeigt ...

PHP: 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style type="text/css"> 
<!-- 
body {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #fff;
	margin: 0;
	padding: 0;
	background-color: #333;
	text-align: center;
}

#center {
	width: 934px;
	margin: 0 auto;
	text-align: left;
	z-index: 0;
	background-color: #d0ad6d;
	border: 5px solid #d0ad6d;
	}
	

#header {
	width: 934px;
	z-index: 1;
	background-color: #f00;
	}
	
#hauptnavi {
	float: left;
	width: 210px;
	z-index: 1;
	text-align: left;
	background-color: #00f;
}

#maincontent {
	margin: 0 0 0 210px;
	width: 724px;
	z-index: 1;
	text-align: left;
	/*background: #0f0;*/
	color: #000;
	
}
--> 
</style>


</head>

<body>


<div id="center">
<div id="header">user's font sizing combined with the values you set. However, if the user has their browser font size set lower than normal, less space will be available in the #mainContent div than you may see on testing.
4. In the Internet Explorer Conditional Comment below, the zoom property</div>

   
   
 
<div id="hauptnavi">user's font sizing combined with the values you set. However, if the user has their browser font size set lower than normal, less space will be available in the #mainContent div than you may see on testing.
4. In the Internet Explorer Conditional Comment below, the zoom propertyuser's font sizing combined with the values you set. However, if the user has their browser font size set lower than normal, less space will be available in the #mainContent div than you may see on testing.
4. In the Internet Explorer Conditional Comment below, the zoom property</div>

<div id="maincontent">Quisque ornare risus quis  ligula. Phasellus tristique purus a augue condimentum adipiscing. Aenean  sagittis. Etiam leo pede, rhoncus venenatis, tristique in, vulputate at,  odio. Donec et ipsum et sapien vehicula nonummy. Suspendisse potenti. Fusce  varius urna id quam. Sed neque mi, varius eget, tincidunt nec, suscipit id,  libero. In eget purus. Vestibulum ut nisl. Donec eu mi sed turpis feugiat  feugiat. Integer turpis arcu, pellentesque eget, cursus et, fermentum ut,  sapien. Fusce metus mi, eleifend sollicitudin, molestie id, varius et, nibh.Quisque ornare risus quis  ligula. Phasellus tristique purus a augue condimentum adipiscing. Aenean  sagittis. Etiam leo pede, rhoncus venenatis, tristique in, vulputate at,  odio. Donec et ipsum et sapien vehicula nonummy. Suspendisse potenti. Fusce  varius urna id quam. Sed neque mi, varius eget, tincidunt nec, suscipit id,  libero. In eget purus. Vestibulum ut nisl. Donec eu mi sed turpis feugiat  feugiat. Integer turpis arcu, pellentesque eget, cursus et, fermentum ut,  sapien. Fusce metus mi, eleifend sollicitudin, molestie id, varius et, nibh.Quisque ornare risus quis  ligula. Phasellus tristique purus a augue condimentum adipiscing. Aenean  sagittis. Etiam leo pede, rhoncus venenatis, tristique in, vulputate at,  odio. Donec et ipsum et sapien vehicula nonummy. Suspendisse potenti. Fusce  varius urna id quam. Sed neque mi, varius eget, tincidunt nec, suscipit id,  libero. In eget purus. Vestibulum ut nisl. Donec eu mi sed turpis feugiat  feugiat. Integer turpis arcu, pellentesque eget, cursus et, fermentum ut,  sapien. Fusce metus mi, eleifend sollicitudin, molestie id, varius et, nibh.</div>

<div id="footer">enean  sagittis. Etiam leo pede, rhoncus venenatis, tristique in, vulputate at,  odio. Donec et ipsum et sapien vehicula nonummy. Suspendisse potenti. Fusce  varius urna id quam. Sed neque mi, varius eget, tincidunt nec, suscipit id,  libero. In eget purusenean  sagittis. Etiam leo pede, rhoncus venenatis, tristique in, vulputate at,  odio. Donec et ipsum et sapien vehicula nonummy. Suspendisse potenti. Fusce  varius urna id quam. Sed neque mi, varius eget, tincidunt nec, suscipit id,  libero. In eget purusenean  sagittis. Etiam leo pede, rhoncus venenatis, tristique in, vulputate at,  odio. Donec et ipsum et sapien vehicula nonummy. Suspendisse potenti. Fusce  varius urna id quam. Sed neque mi, varius eget, tincidunt nec, suscipit id,  libero. In eget purus</div>

</div>

</body>
</html>

Kann jemand helfen?
 
Zuletzt bearbeitet:
Hi,

bei mir sieht es im IE7 und FF gleich aus. Was macht es bei dir denn anders?

Du hast in deinem style-Block "align:center" geschrieben. Das gibts aber gar nicht.
Wenn dann: text-align:center.

Gruß
Matthias
 
Ich glaube ich habe es.

Setze mal die Breite in #maincontent auf 721px oder kleiner.

HTML: 
#maincontent {
    margin: 0 0 0 210px;
   width: 721px;
    z-index: 1;
    text-align: left;
    /*background: #0f0;*/
    color: #000;
}
 
Jes, so far!

Das ist ja der "dreipixelbug", der so weit ich weiss, auch schon einen eigenen Namen erworben hat ...
Hab das mal so gelöst:

PHP: 
#maincontent {	
	margin: 0 0 0 210px;
	width: 724px !important;
	width: 721px;
	z-index: 1;
	text-align: left;
	background: #0f0;
	color: #000;	
}

Leider kommt schon das nächste Problem:

Im IE 6 sind irgendwie 3 Pixel Abstand zwischen #hauptnavi und #maincontent.
(habs schon mit margin: 0 0 0 207px probiert, ändert nichts)
 

Anhänge

  • 3pxabstand.jpg
    3pxabstand.jpg
    49,6 KB · Aufrufe: 11
Danke dir, mattit-jah.
Got it!

Der #maincontent musauch noch float: left; enthalten.

PHP: 
#maincontent {	
	float: left;
	width: 724px;
	z-index: 1;
	text-align: left;
	background: #0f0;
	color: #000;	
}
 
Hi,
whiterussian hat gesagt.:
Das ist ja der "dreipixelbug", der so weit ich weiss, auch schon einen eigenen Namen erworben hat ...
Zum Vergrößern anklicken....
bitte benutze das nächste Mal zuvor die Suchfunktion des Forums, denn mit dem entsprechenden Suchbegriff hättest du hier im CSS-Board eine Vielzahl an Themen gefunden, die sich schon in der Vergangenheit mit dem "3px-Bug" des IEs beschäftigt haben. Vielen Dank.
 
Status
Nicht offen für weitere Antworten.

Neue Beiträge

Zurück