XHTMLforum

XHTMLforum (http://xhtmlforum.de/index.php)
-   CSS (http://xhtmlforum.de/forumdisplay.php?f=73)
-   -   Little Boxes Bd.2 - 2.Menüebene (http://xhtmlforum.de/showthread.php?t=59070)

Teaser 04.11.2009 16:46

Little Boxes Bd.2 - 2.Menüebene
 
Hallo,

bin gerade dabei, die zwei Bücher von Hr. Müller durchzuarbeiten. Bis jetzt kann ich gut folgen. Doch eine Sache verstehe ich nicht.

Um die zweite Menüebene zu gestalten wird folgendes im Buch geschrieben:

#seite02 li#navi02 li a,
#seite0201 li#navi02 li a,
#seite0201 li#navi02 li strong,

#seite03 li#navi03 li a,
#seite0302 li#navi03 li a,
#seite0302 li#navi03 li strong, {
background: #ffeda0;
border: none;
}

a) warum werden für die zweite Ebene wieder die ID-Refernzen #seite02 und #seite03 (1.Ebene) verwendet?

b) warum entsteht ein breiterer Rand zwischen 1. und zweiter Menüebene, wenn man diese Zeilen (z.B. für #seite03) weglässt?

Zumal ja in einem früheren Arbeitsschritt die 1px breite border-bottom vom Kopfbereich ja durch eine Hintergrundgrafik ersetzt wurde. Somit dürfte es doch zu gar keiner Doppelbildung eines Rahmens kommen, oder?

Bin übrigens jetzt neu hier und dies ist mein erster Eintrag/ erste Frage.
Find ich alles recht spannend.

Nebenbei gefragt (Stichpunkt IE-Patches)
Macht es eigentlich Sinn, alle möglichen Patches, die man hier (und anderswo) findet, in einer Musterdatei zusammenzufassen und im HTML-Link immer darauf zu verweisen, egal, ob man nun alle Patches benötigt oder nicht?

Gruß
Teaser (Michael)

hubspe 04.11.2009 18:20

Hi,

Zitat:

Zitat von Teaser (Beitrag 449833)
Nebenbei gefragt (Stichpunkt IE-Patches)
Macht es eigentlich Sinn, alle möglichen Patches, die man hier (und anderswo) findet, in einer Musterdatei zusammenzufassen und im HTML-Link immer darauf zu verweisen, egal, ob man nun alle Patches benötigt oder nicht?

so auf die Schnelle:
Nein das macht keinen Sinn.

Es kann durchaus vorkommen, das so ein nicht benötigter Conditional Comment zu Darstellungsproblemen führt.

Z.B. braucht der IE manchmal position:relative; um ein Darstellungsproblem zu beseitigen.
Dadurch ändert man aber die Stapelreihenfolge auf der Z-Achse, d.h. Elemente können sich dann unerwünschterweise falsch aufeinanderschichten.

Deshalb immer nur die Anweisungen für den IE definieren, die man wirklich braucht.

Ich glaub diese unselige YAML-Framework hat so eine Datei mit jeder Menge IE-Pauschal-Hacks.

Teaser 04.11.2009 20:38

IE-Patches
 
O.k. Das leuchtet mir ein.
Nun hab ich hier und bei Peter Müller gelesen, dass, wenn der Firefox eine Seite so darstellt wie ich sie mir vorstelle und der IE nicht, es wahrscheinlich an dessen Eigenarten liegt.

Nur - wie finde ich bei den vielen Patches, die es für diesen Browser in seinen vielen Versionen gibt, den, der für "meinen" Fall zutrifft?
Gibt es da online irgendwo eine Art Liste nach der Art: Wenn.... dann...?

Gruß

Teaser / Michael

pmmueller 04.11.2009 20:56

Na, dann bin ich ja wohl dran mit antworten. Ich nehme mal an, dass du mit deiner Frage Kapitel 7 meinst, "Horizontale Navigation mit zwei Ebenen": Und du bist auf S. 150. Stimmt's? Hat ein bisschen gedauert, bis ich die Stelle gefunden habe. Das ist über zwei Jahre her ;)

Zitat:

Zitat von Teaser (Beitrag 449833)
a) warum werden für die zweite Ebene wieder die ID-Refernzen #seite02 und #seite03 (1.Ebene) verwendet?

#seite02 li#navi02 li a selektiert nicht die 1. Ebene. li li bedeutet "ein Listenelement in einem Listenelement". Was gleichbedeutend ist mit der 2. Navigationsebene. Bei der ersten Ebene ist das ein bisschen anders. Schau dir die Selektoren noch mal genau an.

Zitat:

Zitat von Teaser (Beitrag 449833)
b) warum entsteht ein breiterer Rand zwischen 1. und zweiter Menüebene, wenn man diese Zeilen (z.B. für #seite03) weglässt?

Breiteren Rand kann ich nicht entdecken. In dem Schritt werden A und STRONG gestaltet, weil sie ansonsten einen border aus Zeile 31 erben (von "#navibereich a,#navibereich strong") und deshalb dann anders aussehen.

pmmueller 04.11.2009 21:09

Zitat:

Zitat von Teaser (Beitrag 449868)
Gibt es da online irgendwo eine Art Liste nach der Art: Wenn.... dann...?

Der erste Versuch ist immer hasLayout (Details dazu: LB1 online und "Über hasLayout") für die relevanten Elemente.

Blättere in "Little Boxes 2" einfach mal ein bisschen weiter, in Kapitel 9 bei der vertikalen Navigation wird das ausführlich gezeigt, wie das geht (ab S. 193).

hubspe 05.11.2009 08:19

Zitat:

Zitat von Teaser (Beitrag 449868)
Nur - wie finde ich bei den vielen Patches, die es für diesen Browser in seinen vielen Versionen gibt, den, der für "meinen" Fall zutrifft?
Gibt es da online irgendwo eine Art Liste nach der Art: Wenn.... dann...?

jep, gibbet:

Der Standardartikel über HasLayout
Adobe Bugliste
Bugsammlung

Teaser 05.11.2009 16:22

Breite Linie zwischen den zwei Menüreihen
 
Hallo Peter (falls ich dich so nennen darf).

Das mit li li ist mir schon klar bei #seite02 li#navi02 li a.
Was mich verwundert ist der Anfang mit#seite02, die sich - meiner Ansicht nach - doch auf die 1. Menüreihe bezieht, da alle Seiten der 2. Reihe vierstellig sind (0201, 0202 etc.).

Meine Logik hätte mir #seite0201 li#navi 02 li a vorgeschlagen und DAS irritiert mich eben ein wenig.

Natürlich, deine Beschreibung funzt, aber ich will eben dem "warum" auf dem Grund gehen, damit ich das Prinzip verstehe.

Und was die breitere Linie angeht:
Wenn du z.B. die Zeile #seite03 li#navi03 li a aus dem Stylesheet rausnimmst, so abspeicherst und dir die Seite dann mal im Firefox oder IE anschaust, dann ist zwischen der 1. und 2. Reihe eine dickere Linie zu sehen, deren Ursprung ich mir nicht erklären kann.

Kannst Du mir das erklären?

Und danke übrigens an hubspe für die Links!!

pmmueller 05.11.2009 21:53

Liste der Anhänge anzeigen (Anzahl: 1)
Zitat:

Zitat von Teaser (Beitrag 449927)
Meine Logik hätte mir #seite0201 li#navi02 li a vorgeschlagen und DAS irritiert mich eben ein wenig.

Dann verstehe ich die Frage gar nicht mehr, die Zeile kommt doch direkt danach:
Code:

#seite02 li#navi02 li a,
#seite0201 li#navi02 li strong ...

Der erste Selektor greift, wenn Seite 2 angeklickt wird und die zweite Ebene erscheint, aber noch keine Unterseite ausgewählt ist. Meinst du das?
Zitat:

Zitat von Teaser (Beitrag 449927)
Wenn du z.B. die Zeile #seite03 li#navi03 li a aus dem Stylesheet rausnimmst, so abspeicherst und dir die Seite dann mal im Firefox oder IE anschaust, dann ist zwischen der 1. und 2. Reihe eine dickere Linie zu sehen, deren Ursprung ich mir nicht erklären kann. Kannst Du mir das erklären?

Ich habe mal den kompletten Style auskommentiert. Die Links sind dann wie erwartet nicht formatiert, aber dickere Linien kann ich nicht erkennen (siehe Screenshot, links mit und rechts ohne Style).

Teaser 27.11.2009 13:57

2.Menüebene
 
Hallo Peter,

etwas späte Antwort, aber ich war beruflich mom etwas arg eingespannt.
Das mit der zweiten Ebene habe ich jetzt endlich begriffen. Die Anweisung
#seite02 li#navi02 li a. ist ja sowas wie eine Pfadangabe.

Mich hat in dem Kapitel über die Gestaltung der zweiten Menübebene immer der Bezug auf das #seite02 gewundert, die ja was mit der 1. Ebene zu tun hat:

#seite02 li#navi02 li a,
#seite0201 li#navi02 li a,
#seite0201 li#navi02 li strong,

#seite03 li#navi03 li a,
#seite0302 li#navi03 li a,
#seite0302 li#navi03 li strong, {
background: #ffeda0;

Aber wenn man das als eine Pfadangabe sieht, ist das natürlich klar.

Also: ich danke für die Hilfe.

emti 27.11.2009 14:10

@hubspe
Die Bugsammlung kannte ich auch noch nicht. :thumbsup:


Alle Zeitangaben in WEZ +2. Es ist jetzt 15:59 Uhr.

Powered by vBulletin® Version 3.8.11 (Deutsch)
Copyright ©2000 - 2020, vBulletin Solutions, Inc.

© Dirk H. 2003 - 2019