Problem: Internet Explorer zeigt DIV fehlerhaft an

03.01.2005, 23:18

Hallo Leute, ich habe ein Problem

. Hoffe ihr könnt mir helfen.

Problem:
Vor drei Tagen habe ich angefangen, meine Website (http://www.surfhtml.de) komplett neu aufzubauen. Valides XHTML, CSS, Templates (Smarty) usw. Ich verwende DIV's für das Design bzw. die Strukturierung der Inhalte. Alles klappte wunderbar, bis ich einen Freund bat, sich das ganze mal unter Windows mit dem Internet Explorer anzusehen. Da sieht das ganze nämlich so aus:

Screenshot

Bei meinem System wird alles 100% korrekt angezeigt, auch bei meinem Freund, aber nur wenn er Firefox verwendet. Mit dem IE geht es einfach nicht.

Mein System:
Debian Sarge (3.1) testing
Mozilla Firefox 1.0

Betreffender CSS-Auszug:

Code:

#head {
 width:800px;
 height:140px;
 background-color:#acb8d2;
 background-repeat:no-repeat;
 background-image:url(../images/header.png);
 vertical-align:bottom;
 position:relative;
 text-align:left;
 border-bottom:1px solid #456979;
}

Wie man ja sehen kann, liegt der Fehler darin, dass der IE das obere DIV nicht bis ganz nach rechts anzeigt. Ich habe schon viel probiert, u.a. stunden- und tagelang gegoogelt, geforumsucht, geselfhtmlt, daraufhin verschiedene CSS-Elemente ausprobiert (padding, margin, position,...).... aber leider hat nichts geholfen (sonst würde ich ja hier nicht posten

).

Übrigens: Dass der Text im unteren DIV nach rechts verschoben ist, ist zwar auch eine IE-Macke, aber eine, die ich verzeihen kann... das andere ist wichtiger...

So. Genug getextet. Suche dringend Hilfe. Bitte schnell melden. Danke.

toscho · 04.01.2005, 01:08

Der Container #text hat bei dir diese Regel:

Code:

#text {
 float:right;
 width:800px;
 height:auto;
 font-size:13px;
 text-align:left;
 margin-top:0px;
 margin-left:25px;
 position:relative;
 overflow:auto;
}

Nimm das »float« und das »margin-left« raus. Wie du mit einem Bildschrimlineal sehen kannst, entspricht die Lücke exakt den 25 Pixeln des »margin-left«.

Da der IE Win alle Container mit den nominellen Wert »block« für »display« als »display:table« behandelt, dehnt er Boxen bei »Bedarf« aus.

Gruß
Thomas

04.01.2005, 01:53

Meine swissen einfach (wie obeen gesagt) folgende Zeile im CSS löschen

Code:

MARGIN-LEFT: 25px;

FLOAT muss garnicht unbedingt weg !
Hab's getestet im IE !

*anbei* find ich das Verhalten vom IE hier sinnvoller als vom Mozilla zB !
Denn wenn ich etwas 800 Pixel groß mahce, darunter noch etwas 800 Pixel groß, das aber um 25 nach rechts verschiebe, dann muss es einfach 825 groß sein... gell?

toscho · 04.01.2005, 03:34

Nein, der Initialwert für die Eigenschaft »overflow« ist »visible«, die fließende Box müßte also rechts aus dem Eleterncontainer herausragen. Aber »overflow« ist im IE auch kaputt.

04.01.2005, 11:07

nunja ist css nicht jünger, als der UR Browser ? demnach eine erfindung mozillas?

imported_Ben · 04.01.2005, 11:08

Zitat:

Zitat von 2Fast4UeXtrem

nunja ist css nicht jünger, als der UR Browser ? demnach eine erfindung mozillas?

hä? den zusammenhang verstehe ich jetzt nicht wirklich ..

MrNiceGuy · 04.01.2005, 11:09

*dreamingofiewithcss2.0completelyincluded*

imported_Ben · 04.01.2005, 11:14

Zitat:

Zitat von MrNiceGuy

*dreamingofiewithcss2.0completelyincluded*

junge ... leerzeichen ;P ^^

04.01.2005, 11:16

l0l hey bin grade aufgestanden Namensvetter...
Hatte das wohl falsch gelesen und meinte, ind er Tat, das man ja nicht von 'kaputt' reden könne, da die Funktion ja ... ach weißte, keine Ahnung *lol*
Tschuldige... ja ja... der Alk

04.01.2005, 12:27

An euch alle ein herzliches Dankeschön... hab das margin-left:25px rausgenommen und jetzt sind gleich beide Probleme behoben! *yeah*

Nochmal n'fettes Danke, jetzt geht's endlich wieder weiter! :P

Themen-Optionen
Druckbare Version zeigen Jemanden per E-Mail auf dieses Thema hinweisen
Thema bewerten
Thema bewerten:

Ähnliche Themen
Thema	Autor	Forum	Antworten	Letzter Beitrag
Sessions Problem	StephenKing	PHP Tipps 2008	3	16.10.2007 08:30
PNG Grafik im Internet Explorer nicht Transparent	DonTermi	HTML, Usability und Barrierefreiheit	15	01.11.2006 11:28
Login für Internet Explorer sperren	killer04	HTML, Usability und Barrierefreiheit	7	07.08.2006 19:56
session funktionieren im internet explorer nicht	flflfl	PHP Tipps 2006	5	07.04.2006 16:11
problem!!!		PHP Tipps 2006	6	08.02.2006 11:06
Problem mit Internet Explorer		PHP Tipps 2006	11	03.01.2006 12:25
LLink funktioniert im Internet Explorer nicht.		HTML, Usability und Barrierefreiheit	17	28.12.2005 16:47
[Erledigt] Internet Explorer neu installieren / reparieren		Off-Topic Diskussionen	12	11.12.2005 18:51
submitbutton als image. firefox ok, internet explorer nicht?	Promaetheus	HTML, Usability und Barrierefreiheit	8	28.11.2005 10:47
Internet Explorer stellt meine Tabellen falsch dar.		HTML, Usability und Barrierefreiheit	2	02.10.2005 00:51
Internet Explorer Bildverkleinerung abschalten	Cyber Soldier	HTML, Usability und Barrierefreiheit	0	05.08.2005 13:05
Internet Explorer Bildverkleinerung abschalten	Cyber Soldier	HTML, Usability und Barrierefreiheit	0	05.08.2005 13:04
Internet Explorer Bildverkleinerung abschalten	Cyber Soldier	HTML, Usability und Barrierefreiheit	0	05.08.2005 13:03
PHP Problem im IE		PHP Tipps 2005-2	7	31.07.2005 17:37
Problem mit PFad Firefox - Verzeichnis löschen		PHP Tipps 2005-2	0	19.07.2005 16:05

03.01.2005, 23:18
Gast Beiträge: n/a	Problem: Internet Explorer zeigt DIV fehlerhaft an Hallo Leute, ich habe ein Problem . Hoffe ihr könnt mir helfen. Problem: Vor drei Tagen habe ich angefangen, meine Website (http://www.surfhtml.de) komplett neu aufzubauen. Valides XHTML, CSS, Templates (Smarty) usw. Ich verwende DIV's für das Design bzw. die Strukturierung der Inhalte. Alles klappte wunderbar, bis ich einen Freund bat, sich das ganze mal unter Windows mit dem Internet Explorer anzusehen. Da sieht das ganze nämlich so aus: Screenshot Bei meinem System wird alles 100% korrekt angezeigt, auch bei meinem Freund, aber nur wenn er Firefox verwendet. Mit dem IE geht es einfach nicht. Mein System: Debian Sarge (3.1) testing Mozilla Firefox 1.0 Betreffender CSS-Auszug: Code: #head { width:800px; height:140px; background-color:#acb8d2; background-repeat:no-repeat; background-image:url(../images/header.png); vertical-align:bottom; position:relative; text-align:left; border-bottom:1px solid #456979; } Wie man ja sehen kann, liegt der Fehler darin, dass der IE das obere DIV nicht bis ganz nach rechts anzeigt. Ich habe schon viel probiert, u.a. stunden- und tagelang gegoogelt, geforumsucht, geselfhtmlt, daraufhin verschiedene CSS-Elemente ausprobiert (padding, margin, position,...).... aber leider hat nichts geholfen (sonst würde ich ja hier nicht posten ). Übrigens: Dass der Text im unteren DIV nach rechts verschoben ist, ist zwar auch eine IE-Macke, aber eine, die ich verzeihen kann... das andere ist wichtiger... So. Genug getextet. Suche dringend Hilfe. Bitte schnell melden. Danke.


Mister Ad PHP Code Flüsterer Registriert seit: 21.08.2005 Beiträge: 4682 PHP-Kenntnisse: Fortgeschritten

04.01.2005, 01:08
toscho Erfahrener Benutzer Registriert seit: 26.09.2004 Beiträge: 430	Der Container #text hat bei dir diese Regel: Code: #text { float:right; width:800px; height:auto; font-size:13px; text-align:left; margin-top:0px; margin-left:25px; position:relative; overflow:auto; } Nimm das »float« und das »margin-left« raus. Wie du mit einem Bildschrimlineal sehen kannst, entspricht die Lücke exakt den 25 Pixeln des »margin-left«. Da der IE Win alle Container mit den nominellen Wert »block« für »display« als »display:table« behandelt, dehnt er Boxen bei »Bedarf« aus. Gruß Thomas

04.01.2005, 01:53
Gast Beiträge: n/a	Meine swissen einfach (wie obeen gesagt) folgende Zeile im CSS löschen Code: MARGIN-LEFT: 25px; FLOAT muss garnicht unbedingt weg ! Hab's getestet im IE ! anbei find ich das Verhalten vom IE hier sinnvoller als vom Mozilla zB ! Denn wenn ich etwas 800 Pixel groß mahce, darunter noch etwas 800 Pixel groß, das aber um 25 nach rechts verschiebe, dann muss es einfach 825 groß sein... gell?

04.01.2005, 03:34
toscho Erfahrener Benutzer Registriert seit: 26.09.2004 Beiträge: 430	Nein, der Initialwert für die Eigenschaft »overflow« ist »visible«, die fließende Box müßte also rechts aus dem Eleterncontainer herausragen. Aber »overflow« ist im IE auch kaputt.

04.01.2005, 11:07
Gast Beiträge: n/a	nunja ist css nicht jünger, als der UR Browser ? demnach eine erfindung mozillas?

04.01.2005, 11:09
MrNiceGuy Erfahrener Benutzer Registriert seit: 21.05.2008 Beiträge: 387	dreamingofiewithcss2.0completelyincluded

04.01.2005, 11:16
Gast Beiträge: n/a	l0l hey bin grade aufgestanden Namensvetter... Hatte das wohl falsch gelesen und meinte, ind er Tat, das man ja nicht von 'kaputt' reden könne, da die Funktion ja ... ach weißte, keine Ahnung lol Tschuldige... ja ja... der Alk

04.01.2005, 12:27
Gast Beiträge: n/a	An euch alle ein herzliches Dankeschön... hab das margin-left:25px rausgenommen und jetzt sind gleich beide Probleme behoben! yeah Nochmal n'fettes Danke, jetzt geht's endlich wieder weiter! :P