Beiträge von bluefox

bluefox

Hallo HaMF,

anbei ein sehr einfacher Code, der bei mir den Offset verursacht

HTML

<html>
	<head>
		<title>test</title>
	</head>
	<body bgcolor="#FFFFFF">
		<div style="font-family:'Courier New'; font-size:8px; position:absolute; top:0; left:0;">
			<pre><span style="background-color:#FF0000"> test test test </pre>
		</div>
	</body>
</html>

Es gibt einen Offset von 9 Pixeln - selbst, wenn ich den kompletten Code in eine Zeile schreibe.
Gruß Bluefox

Edit: Jo, jetzt hab' ich's: Das pre-Tag erzeugt den Offset !!!

bluefox

Hi alle zusammen,

Boxmodel sagt mir schon was - da ich XSL:FO kenne ...
Was mir aber nicht so klar war, sind die "Inkompetenzen" vom IE - zumindest nicht in dieser Ausprägung.
Somit muss ich zugeben, dass ich mit dem Titel dieses Themas dem FF Unrecht getan habe.
Dank an Bugcatcher und HaMF für die Links !

Eine Sache ist mir noch aufgefallen (weiß nicht, ob das wieder an meiner HTML/CSS-Unzulänglichkeit liegt oder ob's der FF wirklich so darstellt):
Wenn man im HTML-Code z.B. ein <div>-Elemnt auf absolut 0 (Null) positioniert (horizontal und vertikal), dann wird horizontal wirklich auf 0 positioniert, aber vertikal bleibt ein kleiner Offset ...

Gruß an alle,
Bluefox

bluefox

Hallo Wolfgang,

danke für den Hinweis. Nach Korrektur der Gleichheitszeichen sieht es zwar etwas besser aus, allerdings werden die style-Attribute height und width sowie diejenigen zur Positionierung wohl nicht richtig ausgewertet ? Auf jeden Fall überlappt die Anzeige der Zeilen und wird nicht exakt positioniert.
Muss man auf noch mehr achten ?

Gruß Bluefox

bluefox

Hi Belly,

danke für die schnelle Antwort.
Die " haben nicht funktioniert. Hätte mich auch gewundert ...
Die Seiten sind noch nicht online.
Anbei ein ausführlicherer Code. Ein Vergleich mit FF1.0 und IE zeigt bei mir deutlich, dass die class-Attribute alle nicht ziehen ...

HTML

<html>
	<head>
		<title>www.pixolver.com - Kontakt</title>
		<meta http-equiv='Content-Type' content='text/html; charset='iso-8859-1'>
		<meta name='author' content='Martin Quedzuweit'>
		<meta name='keywords' lang='en' content='piXolver,HTML,ASCII,pic2HTML'>
		<meta name='keywords' lang='de' content='piXolver,HTML,ASCII,pic2HTML'>
		<meta name='date' content='2004-10-19'>
		<meta name='robots' content='index'>
		<style type='text/css'>
			<!--

			 a.titleblack          { font-family:Arial; text-decoration:none; color:#000000; font-size=20px; font-weight=bold; }
			 a.titleshadow         { font-family:Arial; text-decoration:none; color:#909090; font-size=20px; font-weight=bold; }
			 a.menulink            { font-family:Arial; text-decoration:none; color:#444444; background-color:#E8E8E8; font-size=10px; font-weight=bold; width=140px; height=14px; padding-left=3px; border-top-width:3px; border-color:#D0D0D0; border-top-style:solid; }
			 a.submenulink         { font-family:Arial; text-decoration:none; color:#444444; background-color:#E8E8E8; font-size=10px; font-weight=normal; width=140px; height=14px; padding-left=15px; border-top-width:3px; border-color:#D0D0D0; border-top-style:solid; }
			 a.menulinkX           { font-family:Arial; text-decoration:none; color:#444444; background-color:#E8E8E8; font-size=10px; font-weight=bold; width=10px; height=14px; border-top-width:3px; border-color:#D0D0D0; border-top-style:solid; }
			 a.toplink             { font-family:Arial; text-decoration:none; color:#555555; background-color:#BBBBBB; font-size:10px; font-weight:bold; width=auto; height=14px; padding-left=5px; padding-right=5px; padding-top=1px; padding-bottom=2px; border-top-width:2px; border-right-width:2px; border-color:#D0D0D0; border-top-style:solid; border-right-style:solid; }
			 a.toplink:hover       { font-family:Arial; text-decoration:none; color:#FFFFFF; background-color:#BBBBBB; font-size:10px; font-weight:bold; width=auto; height=14px; padding-left=5px; padding-right=5px; padding-top=1px; padding-bottom=2px; border-top-width:2px; border-right-width:2px; border-color:#D0D0D0; border-top-style:solid; border-right-style:solid; }
			 a.toplinkleft         { font-family:Arial; text-decoration:none; color:#555555; background-color:#BBBBBB; font-size:10px; font-weight:bold; width=auto; height=14px; padding-left=5px; padding-right=5px; padding-top=1px; padding-bottom=2px; border-top-width:2px; border-right-width:2px; border-left-width:2px; border-color:#D0D0D0; border-top-style:solid; border-right-style:solid; border-left-style:solid; }
			 a.toplinkleft:hover   { font-family:Arial; text-decoration:none; color:#FFFFFF; background-color:#BBBBBB; font-size:10px; font-weight:bold; width=auto; height=14px; padding-left=5px; padding-right=5px; padding-top=1px; padding-bottom=2px; border-top-width:2px; border-right-width:2px; border-left-width:2px; border-color:#D0D0D0; border-top-style:solid; border-right-style:solid; border-left-style:solid; }
			 a.toplinkact          { font-family:Arial; text-decoration:none; color:#555555; background-color:#D0D0D0; font-size:10px; font-weight:bold; width=auto; height=14px; padding-left=5px; padding-right=5px; padding-top=1px; padding-bottom=2px; border-top-width:2px; border-right-width:2px; border-color:#D0D0D0; border-top-style:solid; border-right-style:solid; }
			 a.black09             { font-family:Arial; color:#000000; font-size:9px; font-weight:normal; }
			 a.red10b              { font-family:Arial; color:#9D3229; font-size:10px; font-weight:bold; }
			 a.red11               { font-family:Arial; color:#9D3229; font-size:11px; font-weight:normal; }
			 a.actsite             { font-family:Arial; color:#000000; background-color:#BBBBBB; font-weight=bold; font-size=10px; height=14px; width=140px; padding-left=3px; border-top-width:3px; border-color:#D0D0D0; border-top-style:solid; }
			 a.actsiteX            { font-family:Arial; color:#9D3229; background-color:#BBBBBB; font-weight=bold; font-size=10px; height=14px; width=10px; border-top-width:3px; border-color:#D0D0D0; border-top-style:solid; }
			 a.headline            { font-family:Arial; color:#9D3229; background-color:#FFFFFF; font-weight=bold; font-size=10px; height=14px; width=446px; border-top=10px solid #D0D0D0; border-bottom=2px solid #D0D0D0;}
			 a.text                { font-family:Arial; text-decoration:none; color:#000000; background-color:#E8E8E8; font-weight=normal; font-size=10px; height=auto; width=446px; padding-left=8px; padding-right=8px; padding-top=8px; padding-bottom=12px; }
			 a.mail                { font-family:Arial; text-decoration:none; color:#000000; background-color:#E8E8E8; font-weight=bold; font-size=10px; height=auto; width=446px; padding-left=8px; padding-right=8px; padding-top=8px; padding-bottom=12px; }

			 .texthead             { font-family:Arial; color:#9D3229; font-weight=bold; line-height=14px; }

			 -->
		</style>
	</head>
<body bgcolor="#D0D0D0">


<div style="position:absolute; top:0px; left:0px; background-color:#BBBBBB; width='800px'; height='75px'" >
<!-- hier fehlt noch was -->
</div>
<!-- piXolver -->
<div style="position:absolute; top:22px; left:73px;">
<div style="position:absolute; top:3px; left:3px;">
<a class="titleshadow">piXolver</a>
</div>
<div style="position:absolute; top:0px; left:0px;">
<a class="titleblack">piXolver</a>
</div>
</div>
<!-- nothing but HTML -->
<div style="position:absolute; top:43px; left:85px;">
<a class="red11">nothing&nbsp;but&nbsp;HTML</a><br/>
</div>
<!-- copyright -->
<div style="position:absolute; top:5px; left:693px;">
<a class="black09">©&nbsp;October&nbsp;2004</a>
</div>
<div style="position:absolute; top:15px; left:713px;">
<a class="black09">by&nbsp;M.Quedzuweit</a>
</div>
<!-- top menu -->
<div style="position:absolute; top:58px; left:188px;">
<div style="position:absolute; top:0px; left:0px;">
<a class="toplinkleft" href="index.html">Startseite</a><a class="toplink" href="ueberpixolver.html">Über&nbsp;piXolver</a><a class="toplink" href="download.html">Download</a><a class="toplink" href="gallerien.html">HTML&#x2011;Gallerien</a><a class="toplink" href="onlinehilfe.html">Online&#x2011;Hilfe</a><a class="toplink" href="lizenz.html">Lizenz</a><a class="toplinkact">Kontakt</a>
</div>
</div>
</div>
<!-- =========================================================================================================	site header end -->
<!-- =========================================================================================================	site body begin -->
<!-- body menu -->
<div style="position:absolute; top:90px; left:23px;">
<div style="position:absolute;top:0px; left:0px;">
<table width="160px" cellspacing="0px" cellpadding="0px" border="0">
	<tr><td width="10px"><a name="menu0" class="menulinkX"> </a></td><td><a class="menulink" onMouseOver="menu0.innerHTML='&#x25BA;'" onMouseOut="menu0.innerHTML=' '" href="index.html">Startseite</a></td></tr>
	<tr><td><a name="menu1" class="menulinkX"> </a></td><td><a class="menulink" onMouseOver="menu1.innerHTML='&#x25BA;'" onMouseOut="menu1.innerHTML=' '" href="ueberpixolver.html">Über&nbsp;piXolver</a></td></tr>
	<tr><td><a name="menu2" class="menulinkX"> </a></td><td><a class="menulink" onMouseOver="menu2.innerHTML='&#x25BA;'" onMouseOut="menu2.innerHTML=' '" href="download.html">Download</a></td></tr>
	<tr><td><a name="menu3" class="menulinkX"> </a></td><td><a class="menulink" onMouseOver="menu3.innerHTML='&#x25BA;'" onMouseOut="menu3.innerHTML=' '" href="gallerien.html">HTML&#x2011;Gallerien</a></td></tr>
	<tr><td><a name="menu4" class="menulinkX"> </a></td><td><a class="menulink" onMouseOver="menu4.innerHTML='&#x25BA;'" onMouseOut="menu4.innerHTML=' '" href="onlinehilfe.html">Online&#x2011;Hilfe</a></td></tr>
	<tr><td><a name="menu5" class="menulinkX"> </a></td><td><a class="menulink" onMouseOver="menu5.innerHTML='&#x25BA;'" onMouseOut="menu5.innerHTML=' '" href="lizenz.html">Lizenz</a></td></tr>
	<tr><td><a class="actsiteX">&#x25BA;</a></td><td><a class="actsite">Kontakt</a></td></tr>
</table>
</div>
</div>
<!-- body main -->
<div style="position:absolute; top:83px; left:190px;">
<a class="headline">&#x25BC;&nbsp;<font color="000000">Was mache ich, wenn ich Fragen zu piXolver habe ?</font></a><br/>
<a class="text"><span class="texthead">Bei allen Fragen zu piXolver wenden Sie sich bitte an folgende E-Mail-Adresse:<br/></a><br/>
<a class="mail" href="mailto:service@pixolver.com"><center>service@pixolver.com</center></a><br/>
<a class="text">Ihre Anfrage wird sobald wie möglich bearbeitet. Entweder erhalten Sie eine Antwort per E&#x2011;Mail oder wir nehmen in speziellen Fällen auch telefonisch Kontakt zu Ihnen auf, wenn Sie eine Telefonnummer angegeben haben.</a><br/>
</div>
<!-- =========================================================================================================	site body end -->
</body></html>

Alles anzeigen

Woran könnte es also liegen ?
Gruß Bluefox

bluefox

Aus irgendeinem Grund interpretiert der Firefox 1.0 bei mir keine CSS-Elemente.
Beispiel-Code-Fragment dazu :

Code

<head>
		<meta http-equiv='Content-Type' content='text/html; charset='utf-8'>
		<!-- ... -->
		<style type='text/css'>
			<!--
			 a.black09             { font-family:Arial; color:#000000; font-size:9px; font-weight:normal; }
			 a.red10b              { font-family:Arial; color:#9D3229; font-size:10px; font-weight:bold; }
			 a.red11               { font-family:Arial; color:#9D3229; font-size:11px; font-weight:normal; }
			 .texthead             { font-family:Arial; color:#9D3229; font-weight=bold; line-height=14px; }
			 -->
		</style>
	</head>

Alles anzeigen

Geht leider nicht (IE zeigts richtig an)
Wer weiß eine Antwort ?

Beiträge von bluefox

CSS-Anzeige funktioniert nicht

CSS-Anzeige funktioniert nicht

CSS-Anzeige funktioniert nicht

CSS-Anzeige funktioniert nicht

CSS-Anzeige funktioniert nicht