[Mr_Maniac]

Hallo!

Eine Neugestaltung meiner Seite war längst überflüssig und nun habe ich es in langer Kleinarbeit gemacht.
Meine Idee war, die Navigation mit "Reitern" zu gestalten. Der aktive Reiter steht so, wie man es kennt, im Vordergrund.
Ich habe zwei solcher "Navi"-Leisten in der Seite. Einmal oben für Kategorien (navi) und dann links in der äußeren Box für die eigentlichen Seiten der Kategorie (navi2).
Das funktioniert auch ganz gut. Nur musste ich natürlich etwas herum-Tricksen, damit der aktive Reiter rechts "offen" ist, also direkt in den Content übergeht. Somit hat meine Content-Box (content2) links keinen Border. Dieser wird nämlich von der linken Navi-Leiste (navi2) gestellt. Vielleicht könnt ihr euch jetzt schon vorstellen, was mein Problem ist:
Der "linke" Rahmen, also eigentlich der rechte von der Navi-Leiste (navi2), ist natürlich nur so lang, wie die Navi-Leiste (navi2) selber.
Somit hat die Content-Box (content2) nur teilweise links einen Border und der Rest ist ohne.

Hat jemand eine Idee, wie ich dort auch noch einen Border, also eigentlich nur eine Linie hinbekomme, die aber auch NUR so lange ist, wie die Content-Box (content2) gerade ist?
Ach ja... Es kann auch vorkommen, dass die Content-Box (content2) KÜRZER ist als die Navi-Leiste (navi2). Ich habe schon verschiedene Einstellungen und Maßeinheiten für das min-height von content2 versucht, aber es passt eben nicht in allen browsern.

Link zum veranschaulichen (Seite sollte voll funktionstüchtig sein):
http://mad-ftp.dyndns.org/

P.S.: 1. Ich weiß, dass auch das neue "Design" nicht der Hammer ist, aber es ist auf jeden Fall eine Verbesserung zur ersten "Version" meiner Seite.
2. Ich habe meine Seite via "browsershots.org" getestet und sie scheint in allen "neueren" Browsern nahezu perfekt auszusehen.
Einzige Browser, die größere Probleme gemacht haben: "Dillo 0.8.6", "Navigator 4.8" und die FireFox Vorgänger-Versionen "Phoenix 0.5" und "Firebird 0.7".
"Safari 2.0" stellte die Seite auch korrekt dar, bis auf die erste Navi-Leiste. Dort fehlten die oberen borders.
Im IE6 konnte ich die Seite bisher nicht testen...

EDIT: ARGH! Ein Kumpel von mir war so nett, die Seite im IE6 zu testen... Und dort läuft etwas im großen Stil falsch!

Dazu zwei Anhänge:
1. Wie es aussehen SOLLTE (mit FireFox 1.5 gemacht)

2. Wie es im IE6 aussieht
http://home.arcor.de...ilder/IE6GB.jpg

(Die Anlagen dieses Beitrags beanspruchen insgesamt 120.25KB Speicherplatz.
Damit stehen Dir zur Zeit noch 29.75KB für weitere Anlagen in diesem Beitrag zur Verfügung.
Deshalb musste ich das zweite Bild auf einen WebSpace laden...)

EDIT Nr.2:
Ich habe mir nun IE 5, IE 5.5 und IE6 über IEs4Linux unter Wine installiert
IE 5.5 und IE 6 scheinen sich bei der Seite fast zu 100% identisch zu benehmen.
Die Haupt-Probleme der IEs (bis auf 7, der tut FAST, was er soll ):
1. Das overflow:hidden von content2 wird nicht korrekt umgesetzt. content2 geht "eigentlich" bis ganz links.
2. content1 wird nicht entsprechend zu navi2 verlängert. Somit kann navi2 (Skin-Chooser und Temperatur-Box) über content1 (die äußere "Box") hinausgehen...

EDIT Nr.3:
Inzwischen habe ich das neue Design "Released", da es so gut wie keine Probleme mehr bereitet/bereiten sollte...

Dieser Beitrag wurde von Mr_Maniac bearbeitet: 09. Dezember 2006 - 18:06

[Mr_Maniac]

Da sich nun meine Probleme verdoppelt haben, möchte ich nun noch mal um Hilfe bitten...

Hauptproblem: Der IE6 kann nix

Aaaalso...
1. content1 sollte sich automatisch in Relation zu contentlinks (dort sind die Navi-Leiste sowie die Skin- und Temperatur-Box drinnen) vergrößern. Tut es aber nicht! Somit gehen die Skin- und Temperatur-Box über die content1-Box hinaus. "min-height" kann ich nicht verwenden, da der IE6 das nicht versteht...
2. content1 vergrößert sich, wie es soll, wenn content2 größer wird (also z.B. langen Text enthält). Jedoch sollte contentlinks 100% Höhe von content1 betragen. Okay... Das tut es auch unter FireFox nicht, aber...
3. ...Wenn der Inhalt von content2 am Ende von contentlinks angekommen ist, nimmt der Textfluss wieder 100% Breite von content1 an (da content2 ja entsprechend breit ist). Tabellen werden SOFORT an's Ende von contentlinks geschoben (siehe zweiter "Anhang").
4. Wenn ich versuche, das Problem vom zu breiten content2 mittels einer Browserweiche und einer entsprechenden margin-Angabe zu lösen, funktioniert das mit der Breite zwar, aber contentlinks wird immer noch als ein Objekt behandelt, das umlaufen werden muss. Das bedeutet, dass Tabellen IMMER NOCH UNTER contentlinks stehen. Wenn nun auch rechts eingerückt...

Hier der Aufbau meiner Seite ohne Inhalt:

$html-kopf
  <div id="head">
	<div id="links">
	  $Bild
	</div>
	<div class="HVH1">
	  $Titel
	</div>
	<div id="rechts">
	  $Bild
	</div>
  </div>
  <div class="navi">
	$Kategorien
  </div>
  <div id="content1">
	<div id="contentlinks">
	  <div class="navi2">
		$Navi-Leiste
	  </div>
	  <div id="skinbox">
		$skin-chooser
	  </div>
	  <div id="tempbox">
		$Temperaturen
	  </div>
	</div>
	<div id="content2">
	  $Inhalt
	</div>
  </div>
  $W3-Logos
$HTML-Ende

Wie gesagt: Diese Probleme existieren NUR unter dem IE6. Unter so ziemlich allen anderen "aktuellen" Browsern habe ich nur ein Problem: Der border von content2 (Die Linie, die bei längeren Inhalten fehlt).

Bisher selber getestet unter: FireFox 0.8, 1.0, 1.5, 2.0; IE5, 5.5, 6, 7; Mozilla 1.7

Dieser Beitrag wurde von Mr_Maniac bearbeitet: 07. Dezember 2006 - 17:04

[Mr_Maniac]

Okay... Nach euren Zahlreichen Vorschlägen ( ) habe ich nun einen GAAAAAANZ dreckigen Workaround programmiert:

Da meine Seite ja eh auf PHP läuft, lasse ich den UserAgent-String auswerten und falls der UserAgent ein IE6 oder gar darunter ist, werden contentlinks und content2 in eine ein-Zeilen-Tabelle gefasst!

Ich habe diesen Workaround einfach in die index.php geschoben, weshalb die Tabelle um die ganzen divs herum läuft.
Mir ist nun ziemlich egal, ob das "sauber" ist, hauptsache dieser @$!%&!@"§%§%&§# IE6 stellt die Seite EINIGERMAßEN sauber dar.
Und das tut er nun! Im IE6 sieht die Seite FAST so aus, wie sie soll (der aktive Reiter von navi2 geht leider nicht mehr in den content2 über), im IE 5.5 sieht die Seite FAST so aus wie im IE6 (Der ober Rahmen von navi fehlt und der Abstand zwischen contentlinks und content2 ist zu groß, da sollte eigentlich gar keiner sein) und im IE 5 sieht die Seite FAST so aus, wie im IE5.5 (Die Abstände zwischen head, content1 und dem Seiten-Fuß sind RIEEEEESIG!).
Ich hoffe nur, dass demnächst sehr viele Leute
1. Den IE auf IE7 upgraden werden
oder
2. einen GANZ anderen Browser installieren werden!

So.. Bleibt nur noch das Problem mit der einen Linie... Hat jemand einen Tipp?