Tester gesucht.

[FrankieB]

Hallo,

ich möchte meine Seite gerne weitestgehend auf CSS umstellen.

Leider habe ich bis jetzt mit CSS nur einache Formatierungen vorgenommen. Künftig will ich mit CSS aber auch meine Navigation gestalten.

Dazu habe ich eine kleine Testseite geschrieben, bei der mehrere Menüs angeordnet sind. Die grundlegenden Ideen der verschiedenen Menüs stammen übrigens nicht von mir, sondern habe ich auf diversen CSS-Seiten zusammengetragen.

Laßt euch bitte von dem fürchterlichen Design nicht abschrecken, die Seite dient wirklich nur zum Testen. Die Menüeinträge kommen aus einer Datenbank und werden dynamisch generiert.

Gut, bevor ich weiterbastele würde mich interessieren, ob meine Testseite bei euch bzw. mit euren Browsern "richtig" dargestellt wird.

http://www.brasilieninformation.de/test/upload/div-3.php

Besten Dank schon im voraus.

Grüße
Frankie

[Warren]

Also...

Hallo erstmal...

Meine Voraussetzungen:
IE6
1024*768 pixel
32000 farbe

siiieht alles wunderbar aus...!

genauso wie aufem screenshot!

[Jeena Paradies]

Hallo,

Opera 7.21/Linux 1024x768
So weit ich sehen kann passt alles.

Grüße
Jeena Paradies

[Zeromancer]

Hallo
auch in meinem IE 6.0 und TFT 14" bei 1024x768 sieht es ganz ordentlich aus. Ein bisschen viel Navigation überall.
Weiterhin werden Links auf der linken Seiten beim "hovern" fast zu hell zum lesen (gelber background und weiße Schrift)

MfG

André

[FrankieB]

Hallo Andre,

danke für deine Bemühungen ;-)

[...] Ein bisschen viel Navigation überall.

Du glaubst ja doch nicht ernsthaft, daß ich all' diese Navigationsmenüs so in meine "richtige" Seite integrieren werde? Ich kann dich beruhigen, es wird so sein, daß es eine horizontale Hauptnavigation (oben oder unten) und eine vertikale Subnavi (links oder rechts) gibt.

Weiterhin werden Links auf der linken Seiten beim "hovern" fast zu hell zum lesen (gelber background und weiße Schrift)

Ja, das stimmt wohl, aber wie schon gesagt, es ist eben eine Testseite.

Gruß
Frankie

[Ingo]

Hi,
also mein Mozilla mag die Seite überhaupt nicht.
Im Opera stimmt es _ungefähr_. Du solltest Dich mit dem richtigen Box-Modell beschäftigen und nicht das falsche des IE zugrunde legen. Auch empfiehlt es sich, ruhig mal selber zu testen und sich mindestens zwei Browswer außer dem IE hierfür zu installieren; einen Gecko-basierten wie Mozilla und Opera.
Auf http://css.maxdesign.com.au/listamatic/ findest Du übrigens nicht nur eine gute Ansammlung von CSS-Menüs, sondern auch Angaben zu den unterstützten Browsern.

freundliche Grüße
Ingo

[FrankieB]

Hallo Ingo,

also mein Mozilla mag die Seite überhaupt nicht.

Das ist schlecht ,-(

Im Opera stimmt es _ungefähr_.

Was heißt ungefähr?

Auf http://css.maxdesign.com.au/listamatic/ findest Du übrigens nicht nur eine gute Ansammlung von CSS-Menüs, sondern auch Angaben zu den unterstützten Browsern.

Warum hast Du mir diesen Link nicht früher gegeben? *SCNR* ...

Nein, ernsthaft jetzt, der Link ist spitze und wenn ich ihn schon früher gekannt hätte, wäre mir viel Arbeit erspart geblieben.

freundliche Grüße

Ebenfalls
Frankie

[Ingo]

Hi,

also mein Mozilla mag die Seite überhaupt nicht.
Das ist schlecht ,-(

sehr schlecht sogar: u.a. ist das obere linke menü von einer schwarzen box umschlossen, die bis über die bildschirmmitte geht...

Im Opera stimmt es _ungefähr_.
Was heißt ungefähr?

das einige boxen um wenige px nicht passen. wie ich schon sagte: falsches box-modell.

Warum hast Du mir diesen Link nicht früher gegeben? *SCNR* ...

wenn du nicht fragst..;-)

freundliche Grüße
Ingo

[wahsaga]

hi,

Gut, bevor ich weiterbastele würde mich interessieren, ob meine Testseite bei euch bzw. mit euren Browsern "richtig" dargestellt wird.
http://www.brasilieninformation.de/test/upload/div-3.php

so sieht's bei mir im IE 5.0/Win NT aus:

<img src="http://www.isis.de/~wazgnuks/pics/brasil.jpg" border="0" alt="">

ziemlich viele überlagerungen, die wohl so wahrscheinlich nicht gewünscht waren ...?

gruss,
wahsaga

[FrankieB]

Hallo wahsaga,

so sieht's bei mir im IE 5.0/Win NT aus:
http://www.isis.de/~wazgnuks/pics/brasil.jpg

danke, daß Du sogar einen Screenshot gemacht hast.

Nein, so sollte es wirklich nicht aussehen ;-(

Abgesehen von extrem unterschiedlichen Abständen der Boxen (im Vergleich zu meiner "Idealvorstellung"), wird natürlich insbesondere die horizontale Menüleiste komplett "falsch" dargestellt.

Dank deines Vorposters Ingo, der mir eine wirklich gute Seite zum Thema Menü+CSS genannt hat, denke ich daß ich die Ursache(n) der mangelhaften Darstellung (aufgrund meines schlechten CSS) vom Grundsatz her begriffen habe. Umgesetzen konnte ich es allerdings noch nicht.

Welchen BoxModelHack würdest Du denn verwenden, damit das Layout auf den gängisten (ja, dazu gehört auch der IE, auch wenn er CSS fehlerhaft interpretiert) annähernd identisch aussieht?

ziemlich viele überlagerungen, die wohl so wahrscheinlich nicht gewünscht waren ...?

Überlagerungen schon, aber nicht so wie es bei dir dargestellt wurde.

Ob Überlappungen überhaupt sinnvoll sind oder nicht ist eine andere Frage. Mit meiner Testseite wollte ich halt mal ein bisschen mit absoluter und relativer Positionierung experimentieren.

Gruss
Frankie

[Ingo]

Hi,

Welchen BoxModelHack würdest Du denn verwenden, damit das Layout auf den gängisten (ja, dazu gehört auch der IE, auch wenn er CSS fehlerhaft interpretiert) annähernd identisch aussieht?

eigentlich ist es ja _nur_ der IE, der das falsche Box-Modell hat.
Die mögliche Abhilfe bei CSS-formatierten Listen hängt hier vom Doctype ab. Bringst Du mit diesem den IE 6 in den standards-complient mode, dann darfst du keinen Hack verwenden, der diesen ausschliesst. Meines Wissens bleibt da nur noch Tantek (wo der IE praktischer Weise auch erst ab der Version 6 durchblickt) oder conditional comments.

freundliche Grüße
Ingo

[FrankieB]

Hi Ingo,

eigentlich ist es ja _nur_ der IE, der das falsche Box-Modell hat.

Ja, da habe ich mich zu allgemein formuliert ... natürlich ist der IE derjenige, der das falsche Box-Modell umsetzt, aber er ist dennoch der meist genutzte Brauser ...

Die mögliche Abhilfe bei CSS-formatierten Listen hängt hier vom Doctype ab. Bringst Du mit diesem den IE 6 in den standards-complient mode, dann darfst du keinen Hack verwenden, der diesen ausschliesst.

Ist denn die Doctype-Tabelle bei z.B. listmatic bzw. alistapart verbindlich?

Ich habe sowohl deine als auch die von dir empfohlene Seite recht genau studiert. Die Seiten sind sehr gut, aber leider ist mir immer noch nicht ganz klar welchen "Hack" (wenn überhaupt) ich verwenden soll.

Meines Wissens bleibt da nur noch Tantek (wo der IE praktischer Weise auch erst ab der Version 6 durchblickt) oder conditional comments.

Wie würde der IE 6+ den Tantek interpretieren, oder gilt das nur für die früheren Versionen des IE?

... conditional comments == ?

Freundliche Grüße
Frankie

[Ingo]

Hi,

um es vielleicht etwas deutlicher zu formulieren:

• Der IE hat bis zur Version 5.5 das falsche Box-Modell.
• In der Version 6 kennt er zwar das korrekte Box-Modell, verwendet es aber nur im standards-compliant mode.
• Bei altem, unvollständigem oder nicht erkanntem Doctype fällt der IE6 in den quirks mode zurück.
• Ab der Version 6 läßt sich der IE durch den Tantek-Hack nicht mehr beeinflussen; interpretiert die so versteckten Anweisungen also.

Daraus folgt:
Sofern über den Doctype der standards-compliant mode aktiviert wird, verhält sich der IE6 _anders_ als seine Vorgänger. Daher darf er _keine_ Korrektur des Box-Modells bekommen.
Eine Lösung bietet hier der Tantek-Hack, da hier sämtliche moderne Browser und der IE6 die nachfolgenden Definitionen interpretieren, frühere IE-Versionen hingegen nicht.
Wenn der IE im quirks mode rendert, kann und muß er genauso behandelt werden, wie seine Vorgänger. Hier bietet sich z.B. der Child-Selektor an.

Conditional comments sind - zu deutsch - bedingte Kommentare, also HTML-Kommentare, die der IE aber dennoch interpretiert, z.B.:
<!--[if IE]><style type="text/css">@import url(scrollbar.css);</style><![endif]-->
und ich finde sie sehr nützlich, da hierüber der IE ab Version 5.? gezielt angesprochen werden kann und sogar bestimmte Versionen von ihm. Näheres gibt es auf den Seiten von microsoft.

freundliche Grüße
Ingo

[FrankieB]

Hallo,

zu allererst möchte ich mich bei allen Testern bedanken, insbesondere bei Ingo und dem "wahsaga".

Meinen 2. Versuch mit CSS-Menüs findet ihr unter:

http://www.brasilieninformation.de/test/upload/css_roll12.php

Wird diese Seite einigermaßen korrekt dargestellt?

Für Tips und Tricks bin ich nach wie vor dankbar.

Grüße
Frankie

[Stonie]

Hallöle!

hier ein screenshot von meinem Mozilla:

http://www.nefkom.net/asteinmann/brazilinfo.jpg

ich weiss, warum ich Tabellen nehme, auch wenn das böse ist... ;o)

File Griese,

Stonie