Morzilla Firefox und CSS probleme

JEGO · 15.11.2004, 14:01

hi Zusammen,

ich habe eine Testseite gemacht um ein par css zu testen.
im IE geht alles. jedoch z.B. im Firefox haut bei den Styleanweisungen wohl was nicht hin...
Link

Hier die Seiten Strucktur:

Code:

<?php error_reporting(E_ALL); ?>
<html>
<head>
<title>Test Seite</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<link rel="stylesheet" type="text/css" href="style/schrifften.css">
<link href="style/page.css" rel="stylesheet" type="text/css">
</head>
<body>
	<table width="100%" height="100%" border="0" align="center" cellpadding="0" cellspacing="0">
		<tr>
			<td  height="100" colspan="2">
			
				<div class="hg_head" id="head">
					<?php include ("template/head.tpl.htm"); ?>
				</div>
			</td>      
		</tr>
		<tr>
			<td width="180" valign="top">
			
				<div id="links">	
					<?php include ("template/navi.tpl.htm"); ?> 
				</div>
			</td>
			<td align="left" valign="top">
			
				<div id="mitte" align="left"> 
					<?php include ("inhalt.php"); ?>
				</div>
			</td>
		</tr>
		<tr align="center" valign="baseline">
			<td  height="10" colspan="2">
			
				<div id="footer">
					<?php include ("template/footer.tpl.htm"); ?>
				</div>
			</td>
		</tr>
	</table>
</body>
</html>

und Hier das CSS:

Code:

#head { }
#links {
   		 height:100%;
		 FLOAT: right;}
#mitte {
		margin-left:10px;
		height:100%;
		overflow:auto;}
#footer {
		height:20px;
		font-family: Arial, Helvetica, sans-serif;
		font-size: 12px;
		color: #FFFFFF;
		text-decoration: none;
		background-color:#FE8806;}
a {
		font-family: Arial, Helvetica, sans-serif;
		font-size: 12px;
		color: #FFFFFF;
		text-decoration: none;}
a:hover {
		font-family: Arial, Helvetica, sans-serif;
		font-size: 12px;
		color: #FDEA00;
		text-decoration: none;}
a:link {
		text-decoration: none;}
a:visited {
		text-decoration: none;}
a:active {
		text-decoration: none;}
body {
		background-attachment: fixed;
		background-image: url(../bilder/hg.gif);
		background-repeat: no-repeat;
		background-position: left top;
		margin-top:0;
		margin-left:0;
		margin-right:0;
		margin-bottom:0;
		overflow:visible;}

weiss einer warum das im Firefox so nicht geht???

toscho · 15.11.2004, 22:26

Was genau geht denn nicht? FireFox 1.0 kann die Seite überhaupt nicht laden; in Opera sehe ich nicht, welcher der vielen Fehler dich besonders drückt.
Bitte beschreibe dein Problem so genau wie möglich. »Irgendwas geht nicht« ist zuwenig.

Gruß
Thomas

supertramp · 16.11.2004, 07:54

bei sieht es bei IE6 und FF1.0 PR (NF) genauso aus.
bei beiden noch ne Menge Arbeit...

JEGO · 16.11.2004, 10:35

Sorry, hab natürlich mein vorrangiges Problem nicht geschildert....

ganz vergessen... sorry

Also ich möchte erreichen, das das layout , egal bei welchem Browser und in welcher Auflösung immer width="100%" und height="100%" hat.
und nur die rechte Tabellenspallte ein Autoscroll hat....
aber ich bekomme das irgendwie nicht hin....

JEGO · 16.11.2004, 16:41

So hab das noch mal überarbeitet.
aber ich komme nicht weiter....

Hier die geänderte version.

Code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<HTML>
<HEAD>
<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=iso-8859-2">
<TITLE>Untitled Document</TITLE>
<LINK rel="stylesheet" type="text/css" href="style/schrifften.css" title="Schriften">
<LINK href="style/page.css" rel="stylesheet" type="text/css" title="Seitenlayout">
</HEAD>

<BODY>
	<div ID="a">
		<div ID="head"><?php include ("template/head.tpl.htm"); ?></div>
			<div ID="links"><?php include ("template/navi.tpl.htm"); ?> </div>
			<div ID="mitte"><?php include ("inhalt.php"); ?></div>
		<div ID="footer"><?php include ("template/footer.tpl.htm"); ?></div>
	</div>
</BODY>
</HTML>

und hier der Style:

Code:

HTML {
		height:100%;}
		
BODY {
		background-attachment: fixed;
		background-image: url(../bilder/hg.gif);
		background-repeat: no-repeat;
		background-position: left top;
		margin:0% 0%;
		padding:0% 0%;
		height:100%;}
DIV#a {
		height:99%;
		width:99%;
		margin:0% 0%;
		padding:0% 0%;
		overflow:hidden;
		border:1px solid #FF0;}

#head {
		height:100px;
		width:100%;
		border:1px solid #000;}
#links {
		height:80%;
		clear:right;
		float:left;
		width:20%;
		border:1px solid #000;}
#mitte {
		height:80%;
		float:left;
		overflow:auto;
		border:1px solid #000;}
#footer {
		height:20px;
		font-family: Arial, Helvetica, sans-serif;
		font-size: 12px;
		color: #FFFFFF;
		clear:left;
		width:100%;
		text-decoration: none;
		background-color:#ED902A;
		border:1px solid #000;}
a {
		font-family: Arial, Helvetica, sans-serif;
		font-size: 12px;
		color: #FFFFFF;
		text-decoration: none;}
a:hover {
		font-family: Arial, Helvetica, sans-serif;
		font-size: 12px;
		color: #FDEA00;
		text-decoration: none;}
a:link {
		text-decoration: none;}
a:visited {
		text-decoration: none;}
a:active {
		text-decoration: none;}

toscho · 16.11.2004, 19:17

Im Moment ist div#a immer so hoch wie der Viewport; dein »overflow:hidden« wird also nie gebraucht.
Überdenk deinen Ansatz nochmal in aller Ruhe. Momentan sieht es in allen Browsern, die ich gerade zur Hand habe, grauenhaft aus – inklusive IE Win.

10px Schriftgröße sind auf meinem Monitor übrigens Fliegendreck; im IE sehe ich da nur eine dunkelgraue Schmierlinie.
Bitte überlaß die Wahl der passenden (=der aktuellen Lesesituation angemessenen) Schriftgröße dem Leser, wenn du tatsächlich gelesen werden willst.

Gruß
Thomas

16.11.2004, 21:39

Zitat:

10px Schriftgröße sind auf meinem Monitor übrigens Fliegendreck;
im IE sehe ich da nur eine dunkelgraue Schmierlinie.
Bitte überlaß die Wahl der passenden (=der aktuellen Lesesituation angemessenen) Schriftgröße dem Leser,
wenn du tatsächlich gelesen werden willst.

Gruß
Thomas

und wie stellt man das am besten an?

toscho · 16.11.2004, 23:09

Mit

Code:

body {
    font-size: 100.01%;
}

…und dem Verzicht auf alles, was darunter liegt – zumindest für den normalen Lauftext.
Die prozentuale Angabe ist nötig, damit der IE Win vernünftig skaliert, das extra ».01« damit Opera bis Version 6 nicht ein Pixel abzieht. Bei allen folgenden Angaben arbeite man mit der Einheit »em«, um weiteren Problemen mit Opera aus dem Weg zu gehen.

Mehr braucht man nicht.

Gruß
Thomas

fantast · 16.11.2004, 23:54

@toscho sach mal machst du das eigentlich professionell ? also browser kennen ?

nochmal ne frage: problem ist, dass der ie einen div-layer, der text-align: justify; hat, auf voller breite meines iframes darstellt. is ja soweit prima, soll so sein, problem is nur, dass wenn der inhalt zu lang wird, und eine vertikale scrollbar eingeblendet wird, die breite des div-layers nich angepasst wird, also immernoch 100% betraegt, und daher dann auch noch eine horizontale scrollbar eingeblendet wird, damit man den rest, der von der vertikalen scrollbar jetzt verdeckt wird, noch sehen kann, was sehr haesslich aussieht.
hoffe ihr habt das verstanden...

warum kann nich alles so schoen wir beim ff sein ?!?

waere cool, wenn ihr ne idee haettet...

zu bewundern is das problem wie ueblich auf www.olneyair.de

danke
f

toscho · 17.11.2004, 06:49

Naja, ich bin Interface-Gestalter, und CSS ist sozusagen eine der wichtigsten Sprachen für mich…

»text-align« ist im IE kaputt. Hm, das trifft eigentlich auf alle Eigenschaften zu. Jedenfalls hilft dem horizontalen Scrollbalken manchmal ein »overflow:hidden« ab.

Besser wäre es freilich, du würdest auf den Iframe verzichten; dann könnte man auch einzelne Seiten verlinken.

Oh, und sieh dir die Seite mal in Opera 7 an; das sieht grauenhaft aus. Du scheinst irgendeine kaputte Weiche eingebaut zu haben, hm? Jedenfalls bekomme ich nicht dasselbe Stylesheet wie in Mozilla.
Außerdem wird mir dein XHTML-Code als »text/html« angedreht, obwohl mein Accept-Header ausdrücklich »application/xhtml+xml« verlangt.

Gruß
Thomas

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
[Erledigt] Firefox / IE - Probleme		HTML, Usability und Barrierefreiheit	5	20.07.2009 17:04
probleme bei internet explorer und firefox	igron	PHP Tipps 2008	0	12.05.2008 17:27
Firefox / IE - ungeahnte Statistik	pepe24	Off-Topic Diskussionen	10	30.04.2007 16:46
Firefox will mein 3-spaltiges Layout mit Footer nicht (CSS)!	vampsoftchef	HTML, Usability und Barrierefreiheit	1	28.02.2007 00:22
templates oder css mit firefox	rbs_phoenix	HTML, Usability und Barrierefreiheit	1	30.10.2006 15:24
Session funktioniert im IE nicht, Firefox ohne Probleme	havok	PHP Tipps 2006	7	14.08.2006 14:05
Dms-Downloadfunktion Mit Firefox klappts... IE will nicht!!		PHP Tipps 2006	5	16.03.2006 13:00
Probleme mit Firefox	lessiv	Off-Topic Diskussionen	1	10.01.2006 15:19
[Erledigt] window.location.href mit firefox		HTML, Usability und Barrierefreiheit	15	18.11.2005 17:49
CSS Layout macht Probleme mit Firefox	Wimme	HTML, Usability und Barrierefreiheit	2	15.10.2005 13:33
Problem mit Firefox	Diego1978	HTML, Usability und Barrierefreiheit	9	11.09.2005 21:17
[Erledigt] shiftKey bei Firefox abfragen		HTML, Usability und Barrierefreiheit	2	05.08.2005 15:08
Problem mit PFad Firefox - Verzeichnis löschen		PHP Tipps 2005-2	0	19.07.2005 16:05
Deer Park Alpha 1 (=Mozilla Firefox 1.1)		Off-Topic Diskussionen	15	09.07.2005 02:32
[Erledigt] verfluchter Firefox		HTML, Usability und Barrierefreiheit	5	08.07.2005 22:51


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

15.11.2004, 22:26
toscho Erfahrener Benutzer Registriert seit: 26.09.2004 Beiträge: 430	Was genau geht denn nicht? FireFox 1.0 kann die Seite überhaupt nicht laden; in Opera sehe ich nicht, welcher der vielen Fehler dich besonders drückt. Bitte beschreibe dein Problem so genau wie möglich. »Irgendwas geht nicht« ist zuwenig. Gruß Thomas

16.11.2004, 07:54
supertramp Erfahrener Benutzer Registriert seit: 01.12.2003 Beiträge: 4.113	bei sieht es bei IE6 und FF1.0 PR (NF) genauso aus. bei beiden noch ne Menge Arbeit... __________________ Aufstrebend, kompetent und werbefrei. www.developers-guide.net

16.11.2004, 10:35
JEGO Erfahrener Benutzer Registriert seit: 01.12.2003 Beiträge: 2.555 PHP-Kenntnisse: Anfänger	Sorry, hab natürlich mein vorrangiges Problem nicht geschildert.... ganz vergessen... sorry Also ich möchte erreichen, das das layout , egal bei welchem Browser und in welcher Auflösung immer width="100%" und height="100%" hat. und nur die rechte Tabellenspallte ein Autoscroll hat.... aber ich bekomme das irgendwie nicht hin.... __________________ Gruß JEGO Ein PHP Script tut, was Du schreibst, nicht was Du willst.

16.11.2004, 19:17
toscho Erfahrener Benutzer Registriert seit: 26.09.2004 Beiträge: 430	Im Moment ist div#a immer so hoch wie der Viewport; dein »overflow:hidden« wird also nie gebraucht. Überdenk deinen Ansatz nochmal in aller Ruhe. Momentan sieht es in allen Browsern, die ich gerade zur Hand habe, grauenhaft aus – inklusive IE Win. 10px Schriftgröße sind auf meinem Monitor übrigens Fliegendreck; im IE sehe ich da nur eine dunkelgraue Schmierlinie. Bitte überlaß die Wahl der passenden (=der aktuellen Lesesituation angemessenen) Schriftgröße dem Leser, wenn du tatsächlich gelesen werden willst. Gruß Thomas

16.11.2004, 23:09
toscho Erfahrener Benutzer Registriert seit: 26.09.2004 Beiträge: 430	Mit Code: body { font-size: 100.01%; } …und dem Verzicht auf alles, was darunter liegt – zumindest für den normalen Lauftext. Die prozentuale Angabe ist nötig, damit der IE Win vernünftig skaliert, das extra ».01« damit Opera bis Version 6 nicht ein Pixel abzieht. Bei allen folgenden Angaben arbeite man mit der Einheit »em«, um weiteren Problemen mit Opera aus dem Weg zu gehen. Mehr braucht man nicht. Gruß Thomas

16.11.2004, 23:54
fantast Erfahrener Benutzer Registriert seit: 14.01.2004 Beiträge: 2.543	@toscho sach mal machst du das eigentlich professionell ? also browser kennen ? nochmal ne frage: problem ist, dass der ie einen div-layer, der text-align: justify; hat, auf voller breite meines iframes darstellt. is ja soweit prima, soll so sein, problem is nur, dass wenn der inhalt zu lang wird, und eine vertikale scrollbar eingeblendet wird, die breite des div-layers nich angepasst wird, also immernoch 100% betraegt, und daher dann auch noch eine horizontale scrollbar eingeblendet wird, damit man den rest, der von der vertikalen scrollbar jetzt verdeckt wird, noch sehen kann, was sehr haesslich aussieht. hoffe ihr habt das verstanden... warum kann nich alles so schoen wir beim ff sein ?!? waere cool, wenn ihr ne idee haettet... zu bewundern is das problem wie ueblich auf www.olneyair.de danke f __________________ Was ist validität?

17.11.2004, 06:49
toscho Erfahrener Benutzer Registriert seit: 26.09.2004 Beiträge: 430	Naja, ich bin Interface-Gestalter, und CSS ist sozusagen eine der wichtigsten Sprachen für mich… »text-align« ist im IE kaputt. Hm, das trifft eigentlich auf alle Eigenschaften zu. Jedenfalls hilft dem horizontalen Scrollbalken manchmal ein »overflow:hidden« ab. Besser wäre es freilich, du würdest auf den Iframe verzichten; dann könnte man auch einzelne Seiten verlinken. Oh, und sieh dir die Seite mal in Opera 7 an; das sieht grauenhaft aus. Du scheinst irgendeine kaputte Weiche eingebaut zu haben, hm? Jedenfalls bekomme ich nicht dasselbe Stylesheet wie in Mozilla. Außerdem wird mir dein XHTML-Code als »text/html« angedreht, obwohl mein Accept-Header ausdrücklich »application/xhtml+xml« verlangt. Gruß Thomas