Unterpunkte der vertikalen Navigation sind links nicht eingerückt

**wolfgangtitze** · 13.12.2011, 15:47

Hallo,
ich versuche mit Contao 2.10.3 eine Website zu erstellen. Als Anleitung arbeite ich nach dem Buch von Peter Müller "Websites erstellen mit Contao" . Meine Website ist schon auf dem Server unter http://www.titzewolfgang.de .
In dem Buch bin ich auf Seite 203 angelangt.
Mein Problem ist nun folgendes und ich bitte Euch um Eure Hilfe: Die Menüunterpunkte von "Artikel erstellen" sind nicht eingerückt. Ich habe schon alles kontrolliert und ich kann keinen Fehler entdecken. Hier z.B. das:unpueinr.JPG. Auf dem Server sieht es so aus /html/contao/tl_files/themes/blaues_theme: blauesthe.JPG .
Vielleicht entdeckt Ihr den Fehler.
Gruß Wolfgang

**dieselboy** · 13.12.2011, 16:02

Hallo Wolfgang,

ich kenne das Buch von Peter Müller nicht, aber die Lösung ist recht trivial. Du musst in das Stylesheet navigation.css folgende Anweisung einbauen:

Code:

.mod_navigation .level_2 li { padding-left:10px }

Wobei die 10px nur ein Beispiel sind. Wenn du das Contao-eigene CSS-Framework nutzt, dann musst du unter Themes > Stylesheets > Navigation (bin mir nicht sicher, ob das so heißt) einen neuen Selektor anlegen

Code:

.mod_navigation .level_2 li

und die 10 im 4. Feld bei Padding angeben.

Viele Grüße
Daniel

[Edit: Ergänzung]

**pmmueller** · 14.12.2011, 08:00

Tausend Wege führen nach Rom, auch der von Daniel, aber das löst Wolfgangs Problem nicht wirklich. Im Buch wird die Einrückung mit folgenden Style erreicht (siehe auch den linken Screenshot von Wolfgang).

#left .mod_navigation li li a,
#left .mod_navigation li li span {
margin-left: 18px;
}

Diese Anweisung kommt im Browser aber nicht an. Die Website wird momentan mit externen Stylesheets formatiert (via zentrale.css) und die Anweisung sollte in navigation.css stehen. Dort steht sie aber nicht. Auch die anderen Styles aus demselben ToDo-Kästchen stehen nicht im Stylesheet.

Der häufigste Grund für dieses Phänomen lag bis jetzt in der Verwechslung von internen und externen Stylesheets. Kann das der Fall sein, Wolfgang? Hast du die Styles vielleicht in ein internes Stylesheet namens navigation geschrieben? Oder gibt es vielleicht die navigation.css noch in einem anderen Ordner?

EDIT:
Wenn du mit externen Stylesheets weiterarbeiten möchtest, kannst du die internen Stylesheets im Bereich "Themes - Seitenlayout" de-aktivieren oder in "Themes - Stylesheets" komplett löschen, um ganz sicher zu gehen, dass die nicht versehentlich dazwischen funken.

**pmmueller** · 14.12.2011, 08:05

In dem Stylesheet bildschirm.css gibt es übrigens noch einen Tippfehler:

#main {padding-right:10px;padding-left:10px;line-height:1.7;min-height:300px:}

Der letzte Doppelpunkt, nach 300px, ist zuviel.

**wolfgangtitze** · 14.12.2011, 15:13

Hallo Peter,
diesen Doppelpunkt habe ich eben weggelöscht. Nur leider ist mein Problem dadurch nicht gelöst.

Ich hatte bisher angenommen, dass es in dem von Dir geschriebenen Buch jetzt mit der zentrale.css weitergeht. Das war doch auf Seite 179 . Vielleicht habe ich aber auch etwas falsch verstanden. Ich würde gern wissen, was Du empfiehlst und mir schreibst, wo ich da die Dateien löschen muss.
Gruß Wolfgang

**pmmueller** · 14.12.2011, 15:26

Der Doppelpunkt sollte auch nicht das Problem lösen. Das war nur ein zufällig beobachteter Fehler. Die Lösung deines Problems steht einen Beitrag da drüber. Oder zumindest ein Vorschlag zur Problemlösung.

Ich kann dir nicht wirklich etwas empfehlen, da ich nichts über deine Vorkenntnisse und Vorlieben weiß. Und ich kann dir auch nicht sagen, welche Dateien du wo löschen muss, da ich nicht weiß, was genau du gemacht hast.

Bei Contao gibt es die Möglichkeit, mit internen Stylesheets zu arbeiten (Themes - Stylesheets) oder mit externen Stylesheets. Die Unterschiede werden in Kapitel 7 gründlich erklärt. Internet Stylesheets sind z. B. keine DATEIEN, sondern nur DATEN in einer Datenbank...

Das Buch kann man im Prinzip mit beiden durcharbeiten. Ich schreibe immer nur die Styles hin, und ob man die in einem externen und internen Stylesheet eingibt, macht keinen Unterschied.

Welche von beiden Möglichkeiten du nutzt ist also im Prinzip egal, du solltest dich aber als Einsteiger (vermute ich mal) für eine entscheiden, denn sonst besteht die Gefahr, dass du versehentlich beide benutzt.

Du kannst also gerne die bestehende zentrale.css und die anderen Stylesheets, die dort aufgerufen, weiter nutzen. Ich weiß auch nicht, wo und wie du ihn gespeichert hast, aber der Style zur Einrückung der zweiten Navigationsebene steht nicht in dem Stylesheet, in dem er im Buch gezeigt wird (navigation.css), und deshalb wird die zweite Ebene auch nicht eingerückt.

Konkreter Vorschlag:
- Gehe in die Dateiverwaltung
- Suche das Stylesheet navigation.css
- Schreibe den Style zur Einrückung hinein
- Speichere das Stylesheet
- Schaue dir die Site im Browser an.

Das sollte klappen

**wolfgangtitze** · 14.12.2011, 15:42

Ich probiere gleich Deinen erneuten Vorschlag. Hier nocheinmal einen Screeshot von Themes-Seitenlayout: internencss.JPG. Also diese Kästchen sind leer, die CSS-Dateien also de-aktiviert. Ich bin der Meinung, ich habe es genau nach dem Buch gemacht.
Gruß Wolfgang

**wolfgangtitze** · 14.12.2011, 16:54

Erfolgsmeldung!

Hallo Peter,
jetzt geht es tatsächlich. Ich habe Deinen "Konkreten Vorschlag" ausgeführt. navimiteinr.JPG.

Ich danke Dir.
Gruß
Wolfgang

**pmmueller** · 14.12.2011, 17:41

Wunderbar.

Hast du die Styles in deinem Screenshot selbst so in einer Reihe und ohne Leerstellen geschrieben? Dem Browser ist das egal, aber für dich ist es wahrscheinlich übersichtlicher, wenn du eine Anweisung auf eine Zeile schreibst, so wie im ToDo auf Seite 202.

Da sind übrigens noch ein paar andere Styles drin, die noch nicht in deinem Stylesheet stehen

**wolfgangtitze** · 14.12.2011, 18:43

Ja. Das habe ich selbst so geordnet. Sonst wäre ich nicht daraus schlau geworden.
Welche Styles muss ich denn da noch reinschreiben?

**pmmueller** · 15.12.2011, 08:52

Zitat von wolfgangtitze

Welche Styles muss ich denn da noch reinschreiben?

Das habe ich nicht im Einzelnen überprüft (und habe das auch nicht vor), aber wenn es alles so sein soll wie im Buch beschrieben, dann müssen in deinem Stylesheet auch alle Styles stehen, die im Buch beschrieben werden...

**wolfgangtitze** · 15.12.2011, 14:41

Hallo Peter,
jetzt habe ich alle Styles noch reingeschrieben. Oder? Ich danke Dir.
Gruß Wolfgang

**pmmueller** · 15.12.2011, 15:23

Wenn alles gut funktioniert, dann werden wohl alle Styles drin sein

**Teaser01** · 20.12.2011, 18:54

Hallo Peter,

ich habe/hatte 100% genau dasselbe Problem wie wolgangtitze.
Ich habe -wie bis zu diesem Punkt in deinem Buch beschrieben - deinen Code in das externe Stylesheet geschrieben (sicher an 10 verschiedenen Stellen platziert, gespeichert... aber nix passierte (also zumindest, wenn ich den Weg: Themes>Css>navigation.css > speichern) gegangen bin.

Nach deinem "konkreten Tipp" hab ich die navigation.css mal im Dateimanager geöffnet... und... siehe da: die neuen Einträge sind dort nicht vorhanden (sicher auch 10x probiert). Erst nachdem ich über den Dateimanager gegangen bin und über die dort sichtbare navigation.css deinen Code hineinkopiert und gespeichert habe, wurden die Listenpunkte eingerückt.

Wenn wir davon ausgehen, dass ich all deine Schritte 1:1 bis S.202 (1.Aufl.) nachvollzogen habe und ich trotz Speicherung in Themes>Css>navigation.css diese Einträge im Dateimanager-navigation.css nicht finde :
Liegen hier also zwei namensgleiche aber unabhängige navigation.css im System herum?

(Im kopierten Template fe_page.xhtml - was ja zuvor beschrieben wurde -) liegt der Pfad: <link href="tl_files/themes/blaues_theme/zentrales.css" rel="stylesheet" type="text/css" />. In diesem Ordner liegen alle 4 css-Datein incl. der zentrales.css)

Gruß

Teaser01

P.S.
Hab vor dem Wegschicken dieses Postings noch probiert, deine CSS-Angaben für die zweite Ebene aus der Themes>Css>navigation.css zu löschen: Ergebnis: Die Listenpunkte bleiben trotzdem eingerückt. Also muss doch die navigation.css im Dateimanager gewichtiger???? sein???? (oder die erstere wird nicht mehr eingelesen) Wie soll ich das verstehen?

**Teaser01** · 20.12.2011, 19:24

Man sollte ja auf S. 178 die internen Stylesheets deaktieren...

Die waren noch unter "system/scripts" und scheinen tatsächlich durch das Anlegen der externen "kaskadiert" oder mißachtet zu werden.

Ich blick's jetzt...

.
Kann jetzt also, nachdem sie unter tl_files/themes/blaues_theme liegen entweder über den Dateimanager oder Dreamweaver wie "ganz normale" Dateien laden und bearbeiten... und sogar das steht auf S.177...man sollte vorher lesen, bevor man schreibt...

Sorry!!

**pmmueller** · 20.12.2011, 20:00

Wunderbar, dass du das Problem von selbst lösen konntest.

In der zweiten Auflage haben interne und externe Stylesheets jeweils ein eigenes Kapitel, sodass Verwirrungen dieser Art hoffentlich weniger werden