[CSS] Firefox zeigt die Seite falsch an [CSS]

I-Spy · 02.01.2006, 12:42

Hallo Leute,

Hier ist die Seite auf die ich mich beziehe:
http://www.nano-games.de/test3.htm

Firefox zeigts falsch an:

Internet Explorer zeigt es richtig an:

Code:

<html>
<head>
<title>CSS Test</title>
<style type="text/css">
.item
{
	width: 784px;
	border-width:1px;
	border-color:#999999;
	border-style:solid;
	
	background-color:#D9DEE8;
}

/* Titel Box */
.titleBox
{
	background-color:#CBD2DE;
	border-width:0;
	border-top-width:1px;
	border-left-width:1px;
	border-color:#FFFFFF;
	border-style:solid;
	height:19px;
}

#titleButtons
{
	padding-right:3px;
	text-align:right;
	float:right;
}

#titleText
{
	color:#434343;
	font-family:MS Sans Serif; font-size:12px; font-weight:bold;
	padding-left:7px; padding-top:3px;
	text-align:left;
	float:left;
}

/* Informations Box */
.infBox
{
	border-width:0;
	border-left-width:1px;
	border-top-width:1px;
	border-left-color:#FFFFFF;
	border-top-color:#B4B4B4;
	border-style:solid;
	width:104px;
	float:left;
	background-color:#D9DEE8;
}

/* Informationstext */
.infText
{
	border-width:0;
	border-top-width:1px;
	border-top-color:#F0F0F0;
	border-style:solid;
}

/* Text */
#textBold
{
	color:#434343;
	font-family:MS Sans Serif; font-size:12px; font-weight:bold;
	
	padding-top:4px; padding-left:7px;
}

#textNormal
{
	color:#434343;
	font-family:MS Sans Serif; font-size:12px;
}

#textContent
{
	margin-top:6px;
	margin-left:11px;
	margin-bottom:3px;
}

/* Inhalt */
.contentBox
{
	width:678px;
	float:right;
	border-width:0;
	border-left-width:1px;
	border-top-width:1px;
	border-color:#999999;
	border-style:solid;
	
	background-color:#FFFFFF;
}
</style>
</head>
<body bgcolor="#006699">
<div class="item">
<div class="titleBox">
	<div id="titleButtons">[x]</div>
	<div id="titleText">Hier steht der Titeltext, der kann auch etwas länger sein, je nachdem kann er noch länger sein. Sollte immer gehen.</div>
</div>
<div class="infBox">
	<div class="infText">
		<div id="textBold">Dima</div>
	</div>
</div>
<div class="contentBox">
	<div id="textContent">Text
Text
Text
Text
</div>
</div>
</div>
</body>
</html>

Kann mit bitte einer helfen? Danke!

Gruß Dima

lomtas · 02.01.2006, 13:11

meistens ist es der IE der die Seite falsch anzeigt... nur zur Info. Also der Firefox zeigt sie an, wie du sie gemacht hast. Der IE zeigt sie an, wie er denkt dass du es machen wolltest. Damit ist er eine Ausnahme!!

Baltasar · 02.01.2006, 14:21

Zitat:

Zitat von lomtas

meistens ist es der IE der die Seite falsch anzeigt... nur zur Info. Also der Firefox zeigt sie an, wie du sie gemacht hast. Der IE zeigt sie an, wie er denkt dass du es machen wolltest. Damit ist er eine Ausnahme!!

und hätte man sich mal kurz die zeit genommen in den code zu schauen, hätte man auch ne antwort geben können, die wirklich hilfreich ist.

zur frage: du solltest der infbox vielleicht auch ne höhe zuweisen. in deinem fall wohl height:100%, wenn ich das gerade richtig gesehen hab.

I-Spy · 02.01.2006, 16:19

du solltest der infbox vielleicht auch ne höhe zuweisen. in deinem fall wohl height:100%
Habe ich gemacht: (Firefox)

In IE hat sich aber nichts geändert!

Gruß Dima

lomtas · 02.01.2006, 23:55

height orientiert sich immer am parent, also am div dadrüber. der hat bei dir auch schon keine höhe. also muss er 100% als browserhöhe annehmen.

03.01.2006, 01:12

Also am besten gleich allen div-Umgebungen ne Höhe zuweisen (und zu Fehlervorbeugung auch gleich body ne Höhe zuweisen [am besten 100%]), sonst stehst du nämlich direkt wieder vor dem selben Problem

I-Spy · 03.01.2006, 11:46

Diese Box ist in der Höhe dynamisch! sprich da können verschiedene Längen von Text rein! Was soll ich machen?

Gruß Dima

lomtas · 03.01.2006, 11:51

Gibt einen Trick dazu. Du musst ein Hintergrundbild für das Div machen, was auch den Text enhält. Dieses muss so breit sein wie Text+linke Spalte zusammen. Das machst du ein Pixel hoch und lässte es in y-Richtung wiederholen. Dann die linke Spalte links floaten lassen und du hast den Effekt, dass beide Divs nebeneinander gleich hoch sind. Das ist die einzige mir bekannte Möglichkeit so etwas zu "simulieren".

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
Bei richtiger Eingabe Daten an nächste Seite versenden	xx_heidi_xx	PHP Tipps 2008	49	27.05.2008 14:56
Krieg kein Objekt zurück auf includeter Seite	NONNNNN	PHP Tipps 2008	5	28.03.2008 19:25
Eintrag in DB und Wechsel zu anderer Seite	Darson	PHP Tipps 2008	25	14.01.2008 16:46
CSS: Firefox intepretiert Tooltip falsch	PsychoEagle	HTML, Usability und Barrierefreiheit	3	30.11.2006 10:03
templates oder css mit firefox	rbs_phoenix	HTML, Usability und Barrierefreiheit	1	30.10.2006 15:24
IE stellt Seite (mal wieder) falsch dar	Freeaak	HTML, Usability und Barrierefreiheit	3	13.09.2006 17:00
[Erledigt] window.location.href mit firefox		HTML, Usability und Barrierefreiheit	15	18.11.2005 17:49
[Erledigt] Container im Firefox falsch dargestellt		HTML, Usability und Barrierefreiheit	27	15.08.2005 23:18
Welche seite (Adresse) rief die aktuelle seite auf?		PHP Tipps 2005-2	7	05.07.2005 15:02
[Erledigt] Seite wird nicht angezeigt, untersch. Fehler bei IE/FF/Safar		PHP-Fortgeschrittene	19	31.05.2005 14:52
[Erledigt] Script Interpretaion läuft falsch im Firefox		PHP-Fortgeschrittene	23	11.05.2005 19:01
Seite in Seite		PHP-Fortgeschrittene	3	15.03.2005 19:27
Seite nicht mit content="3600" im Cache gespeicher	scheibo	PHP Tipps 2004	0	19.07.2004 14:49
[Erledigt] PHP Eine neue PHP seite automatisch öffnen		PHP Tipps 2004	1	19.06.2004 12:40


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

02.01.2006, 13:11
lomtas Erfahrener Benutzer Registriert seit: 08.02.2005 Beiträge: 224	meistens ist es der IE der die Seite falsch anzeigt... nur zur Info. Also der Firefox zeigt sie an, wie du sie gemacht hast. Der IE zeigt sie an, wie er denkt dass du es machen wolltest. Damit ist er eine Ausnahme!!

02.01.2006, 16:19
I-Spy Erfahrener Benutzer Registriert seit: 30.11.2004 Beiträge: 202	du solltest der infbox vielleicht auch ne höhe zuweisen. in deinem fall wohl height:100% Habe ich gemacht: (Firefox) In IE hat sich aber nichts geändert! Gruß Dima

02.01.2006, 23:55
lomtas Erfahrener Benutzer Registriert seit: 08.02.2005 Beiträge: 224	height orientiert sich immer am parent, also am div dadrüber. der hat bei dir auch schon keine höhe. also muss er 100% als browserhöhe annehmen.

03.01.2006, 01:12
Gast Beiträge: n/a	Also am besten gleich allen div-Umgebungen ne Höhe zuweisen (und zu Fehlervorbeugung auch gleich body ne Höhe zuweisen [am besten 100%]), sonst stehst du nämlich direkt wieder vor dem selben Problem

03.01.2006, 11:46
I-Spy Erfahrener Benutzer Registriert seit: 30.11.2004 Beiträge: 202	Diese Box ist in der Höhe dynamisch! sprich da können verschiedene Längen von Text rein! Was soll ich machen? Gruß Dima

03.01.2006, 11:51
lomtas Erfahrener Benutzer Registriert seit: 08.02.2005 Beiträge: 224	Gibt einen Trick dazu. Du musst ein Hintergrundbild für das Div machen, was auch den Text enhält. Dieses muss so breit sein wie Text+linke Spalte zusammen. Das machst du ein Pixel hoch und lässte es in y-Richtung wiederholen. Dann die linke Spalte links floaten lassen und du hast den Effekt, dass beide Divs nebeneinander gleich hoch sind. Das ist die einzige mir bekannte Möglichkeit so etwas zu "simulieren".