Liste der Anhänge anzeigen (Anzahl: 3)
Navigations Ebenen stimmen nicht
Hallo zusammen,
Ich habe die ganz normale Standard Music Acedemy Seitenstruktur (Anhang 6761). Dann habe ich das Modul "Navigationsmenü" erstellt.
Formatiert ist es wie folgt (nocht nicht fertig):
Code:
.mod_navigation
{
width:192px;
top:40px;
position:absolute;
float:left;
list-style-type:none;
}
.mod_navigation .first
{
width:192px;
height:19px;
padding-top:5px;
padding-left:10px;
background-color:#aaa;
border-left:1px solid #CE2E12;
}
.mod_navigation ul
{
list-style-type:none;
}
So sieht es aus:
Anhang 6762
Wieso nimmt es "News" als zweiten Hauptpunkt? Eigentlich wären ja Home, The Academy, Courses und Services die Hauptpunkte. Was ist da falsch?
Das Modul ist so eingestellt: Anhang 6763
Wieso die unter Hauptpunkte verkleinert werden ist mir auch fremd! Ich sage ihm doch, dass er das .submenu nach links rücken soll.
Besten Dank für eure Ratschläge!
Gruss Planz
Liste der Anhänge anzeigen (Anzahl: 2)
Hallo MacKP
Danke für deine Hilfe!
Okay, ich habe nun das CSS angepasst auf die Levels.
Code:
.mod_navigation
{
width:192px;
height:250px;
top:40px;
position:absolute;
overflow:hidden;
float:left;
font-family:Verdana,Geneva,sans-serif;
color:#000;
list-style-type:none;
}
.mod_navigation a
{
display:block;
color:#597f91;
}
.mod_navigation a:hover
{
color:#CE1216;
}
.mod_navigation .level_1
{
height:20px;
margin:7px 0 0;
padding-top:4px;
background-color:#D8D8D8;
}
.mod_navigation .level_1 a
{
margin:0 0 0 15px;
padding:0 0 0 6px;
border-left:1px solid #CE1216;
font-size:11px;
font-weight:bold;
}
.mod_navigation .level_2
{
margin:17px 0 3px 23px;
font-weight:bold;
color:#ce1216;
list-style-type:none;
}
.mod_navigation .level_3
{
margin:0 0 3px 23px;
padding:0 0 2px;
border-bottom:1px solid #000;
}
Jetzt sieht es so aus:
Anhang 6771
So muss es mal aussehen:
Anhang 6772
Wieso funktioniert das nicht zb. mit dem level_3?
Danke für eure Hilfe!
Gruss Planz
Liste der Anhänge anzeigen (Anzahl: 4)
Hallo MacKP
Okay, klar. Jetzt ist der fünfer gefallen.
Ja, die Seite kenne ich. Habe mir das Buch auch schon gekauft und einige Themen gelesen.
Ich habe mir das Thema Vertikale Navigation nochmals genauer angesehen. Und auch die Beispiel Dateien genommen und abgeändert. Nun komme ich zwar schon näher ran. Aber jetzt haperts noch beim Level 2.
Code:
#navibereich .level_1 a
{
margin-left:10px;
padding-left:5px;
border-left:1px solid #CE1216;
font-weight:bold;
}
#navibereich .level_2 a
{
margin-left:10px;
padding-left:5px;
border-left:1px solid #fff;
font-weight:bold;
color:#ce1216;
}
#navibereich .level_1 li
{
padding-top:4px;
padding-bottom:4px;
background-color:#D8D8D8;
}
#navibereich .level_2 li
{
padding-top:4px;
padding-bottom:4px;
background-color:#fff;
}
#navibereich .level_1 .active a
{
margin-left:10px;
padding-left:5px;
border-left:1px solid #CE1216;
font-weight:bold;
}
#navibereich .level_2 .active a
{
margin-left:10px;
padding-left:5px;
font-weight:bold;
color:#ce1216;
}
#navibereich .level_1 .active
{
background-color:#F5D0C1;
}
#navibereich .level_2 .active
{
background-color:#fff;
}
#navibereich
{
width:192px;
float:left;
font:12px Arial,Helvetica,sans-serif;
color: black;
margin: 20px 0 20px 0px;
}
/* Liste und Links */
#navibereich ul
{
margin:0;
padding:0;
border-right: none;
border-left: none;
}
#navibereich li
{
list-style: none;
margin: 1em 0;
}
#navibereich .level_2 li
{
padding-left:1em;
}
Hauptnavigation Anhang 6803
Unternavigation Anhang 6804
Kann man irgend wie sagen, dass er Einstellungen nicht nach unter vererbt? z.b der
Code:
border-left:1px solid #CE1216;
wird immer mitgegeben, obwohl ich ihn ja für Level 1 definiert habe. Ich habe es jetzt versucht den Strich unter Level 2 weiss zu machen, damit er wenigstens nicht sichtbar ist. Nicht die schönste Variante ich weiss.
Die Navigation sollte eigentlich so aussehen
Anhang 6802
Ich habe auch noch die CSS Datei der "alten Webseite" (Design bleibt gleich, muss aber neu mit Contao erstellt sein). Nur ist dieser Inhalt nicht "Contao-CSS-TYP" (?):eek:. [Datei im Anhang]
Besten Dank für eure Hilfe!
Gruss Planz
Liste der Anhänge anzeigen (Anzahl: 2)
Hallo Andreas
Okay, nun hat es geklappt. Danke für deine aufräum Arbeit in meinem CSS Urwald :(
Leider gibt es jetzt noch andere Hürden zu überbrücken... Wie z.b wenn ein Navigationspunkt extrem Lange ist vom Text her. Leider verschiebt es sich da nicht dynamisch nach der benötigten grösse des Textes.
Siehe Bild: Anhang 7250
Wie kann man das mitgeben, dass er sich da dynamisch anpasst? Gibt es die Möglichkeit überhaupt?
Jetzt habe ich ja immer in der Navigation ausdrücklich gesagt, dass er die list-style's ausblenden soll. Das macht er auch schön brav. Leider in der #main Spalte auch. Auch wenn ich jetzt dort sage {list-style: dice;} zeigt er mir nichts an. Wie kann ich den jetzt wieder übersteuern?
Anhang 7253
Gruss PLanz
Liste der Anhänge anzeigen (Anzahl: 1)
Hallo Andreas
Okay, nun funktioniert es mit den listenpunkten im Main. Sie wurden vorher schon angezeigt, aber irgendwie überblendet. Habs jetzt hinbekommen.
Zitat:
Hast du dann Probleme level_5 aus dem submenu zu entfernen, kannst du level_5 dort auch mit CSS ausblenden.
Ich habe es jetzt mal so gelöst, dass es einfach im Nirwana verschwindet. Ist wohl nicht die schönste Variante.
Das zweite Navigations Modul habe ich erstellt und im Seitenlayout eingefügt. Da ich es ja jetzt im Seitenlayout entweder ober dem Artikel oder unterhalb des Artikels der Hauptspalte einfügen muss, kommt die Navigation nicht dort hin wo ich sie haben möchte. Nämlich unterhalb des Seitentitels.
Anhang 7308
Wie wäre es möglich, dass der Seitentitel immer oberhalb der Navigation angezeigt wird?
Zitat:
ps list-style: dice; gibt es nicht, meinst du disc?
Ja, ich meinte disc. Sorry.
Gruss PLanz