Unterschiedliche darstellung bei ff und ie

Webdesign & Technik HTML & CSS
1

hallo zusammen,

ich habe 2 kleine problemchen. der internet explorer und der ff zeigen inhalte der webseite unterschiedlich an:

ich weiß nichht woran dies liegen könnte. die webstatistik sieht ja komplett unterschiedlich aus zwischen beiden browsern, ff runde ecken und ohne ohne scrollbalken, ie scrollbalken und eckig.
bei dem anderen bildchen, habe ich beim ff einen abstand zwischen Position 6 und der grafik und unten beim namen auch einen abstand zwischen grafik und namen.
beim ie erscheint kein abstand.
das mit dem abstand erkennt man besser, wenn man position 11 und 12 betrachtet

code ausschnitt der php-webstatistik:

echo "<table class=\"table_zentrieren\" width=\"80%\" border=\"0\" cellpadding=\"0\" cellspacing=\"2\">\n"; echo "<tr>\n"; echo "<td><script src=\"stat/track.php?mode=js\" type=\"text/javascript\"></script> <noscript><div><img src=\"/stat/track_noscript.php\" width=\"1\" height=\"1\" alt=\"stat\" /></div></noscript><object width=\"115\" height=\"147\" data=\"stat/counter.php\" type=\"text/html\"></object></td>\n"; echo "</tr>\n"; echo "</table>\n"; echo "<script src=\"http://js.stats.de/j/0000077117\" type=\"text/javascript\"></script>\n"; echo "<script type=\"text/javascript\"> rs_subpage = 4451; rs_pagename = \"\"; rapidstats(77117);</script>\n"; echo "<noscript><div><a rel=\"oeffneneuesfenster\" href=\"http://www.stats.de/?x=77117\">$link_zu_stat_1</a></div></noscript>\n";

code der Position 6 und Position 7:

echo "<table width=\"100%\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\">\n"; echo "<tr>\n"; echo "<td><p>$spieler_6_position</p></td>\n"; echo "<td><p>$spieler_7_position</p></td>\n"; echo "</tr>\n"; echo "<tr>\n"; echo "<td><p>$spieler_6_bild</p></td>\n"; echo "<td><p>$spieler_7_bild</p></td>\n"; echo "</tr>\n"; echo "<tr>\n"; echo "<td><p>$spieler_6_link_clicktt<br />im Verein seit: $spieler_6_vereinszugehörigkeit<br />Spiele f&uuml;r den TTC: $spieler_6_spieleanzahl</p></td>\n"; echo "<td><p>$spieler_7_link_clicktt<br />im Verein seit: $spieler_7_vereinszugehörigkeit<br />Spiele f&uuml;r den TTC: $spieler_7_spieleanzahl</p></td>\n"; echo "</tr>\n"; echo "</table>\n";

über tipps wäre ich dankbar

mfg tobsp

2

Wenn du ein clientseitiges Problem diskutieren willst, dann poste bitte auch clientseitigen Code - und keinen serverseitigen, der dabei erst mal vollkommen uninteressant ist.

Das mit der Statistik sieht auf den ersten Blick nach fehlerhafter Interpretation von Maßangaben aus - betreibst du die Seite im Quirks Mode? (Informieren, wenn das Stichwort unbekannt ist.)

Mehr kann man dazu vermutlich erst sagen, wenn du mal die Adresse einer Beispielseite nennst. (Dass HTML und CSS dieser valide sein sollten, sollte selbstverständlich sein, vorher bräuchte man sich das gar nicht genauer anschauen.)

3

ok, dann hier die beispielseite: http://ttc-tobi.bplaced.net/neu/herren6test.php
valde sollte die seite seien, jedenfalls bekomme ich keine fehler angezeigt

4

Die runden Ecken sind in der CSS-Datei mit einer proprietären
Eigenschaft nur für die Geckos angegeben. Andere browser
stellen da also völlig korrekt keine Ecken dar.

Zudem besteht der Zähler aus einer (X)HTML-Ausgabe, die wohl
im MSIE den Quirksmodus bewirkt (wegen der ersten Leerzeile),
zudem kann da die Tabelle unterschiedlich interpretiert werden.
Dann kann beim jeweiligen browser eine andere Schriftgröße
eingestellt sein, die die in den CSS-Angaben überschreiben
kann. Da der Zähler wiederum mit einem object mit
Abmessungen in Pixeln eingebunden wird, sind Rollbalken da
relativ normal - ich sehe die auch beim Firefox, ebenso bei
Konqueror und Opera.

Insofern ist das mit dem Zähler alles gut verstehbar.

Das andere Problem kann auch gut mit den verwendeten
Tabellen zusammenhängen, die können in jedem browser etwas
anders dargestellt werden. Kann aber auch an CSS-Problemen
sehen.
Um das genauer zu analysieren, solltest du das auf ein
minimales Testbeispiel reduzieren, in dem nicht viel mehr steht
als die Grundstruktur der (X)HTML, was notwendig ist, um einen
solchen Effekt hervorzurufen und gegebenenfalls das dafür
ebenfalls erforderliche CSS in derselben Datei, dann kann man
sich relativ schnell einen Überblick verschaffen - oder im Verlauf
der Reduktion findest du bereits selbst heraus, woran es genau
liegt.

5

ok ich habe nun ein minimales testbeispiel gemacht:
http://ttc-tobi.bplaced.net/neu/herren6test_neu.php

kann ich dass scrollen bei der statistik irgendwie verhindern?

6

Eventuell mal die Tabellenrahmen sichtbar machen.
Vielleicht liegt es ja daran, daß ‘Position X’ jeweils in einem
Absatz steht, vielleicht verzichtet da der MSIE einfach auf
Abstände in Zellen und andere tun dies nicht. Könntest es
einfach mal mit th statt

Position 9


versuchen, dann fallen p und b weg.
Wenn es da stehenbleiben soll, müßtest du eventuell für das
p explizit Angaben zu margin (und padding?) per CSS machen,
sollte es mit dem p zusammenhängen.

Ansonsten um verdächtige Elemente einen dünnen sichtbaren
Rahmen (oder outline) ziehen und damit gucken, woher der
leere Raum kommen könnte.

Bei dem Zähler empfiehlt es sich, die Schriftgröße nicht in px
anzugeben. Du kannst grob die Größe in em oder ex abschätzen
und dann eben das einbindende object per CSS mit einer
Größe in em oder ex verzieren. Der Zähler hat ja vermutlich
immer ziemlich den gleichen Inhalt, so sollte deine Schätzung
auf em- oder ex-Basis reichen, das object ausreichend groß zu
wählen.

Hinsichtlich der abgerundeten Ecken kannst du dich ja mal bei
der CSS-Arbeitsgruppe des W3C umsehen, wie weit die mit den
abgerundeten Ecken, also dem entsprechenden CSS3-Modul sind.
Gegebenenfalls, wenn das in einem Stadium ist, wo eine
Implementierung empfohlen wird, kannst du ja die dort
vorgesehene Eigenschaft zusätzlich oder statt der proprietären
verwenden. Erhöht die Chance, daß das auch noch ein anderer
browser interpretiert oder in Zukunft interpretieren wird.
Für alte browser ist das so nicht einheitlich verwendbar, da
müßtest du das ganze Teil umbasteln und die abgerundeten
Ecken mit Hintergrundgraphik umsetzen (Suche nach Stichwörtern
wie ‘rounded corners’).