Navigation nachbauen

Hallo,

ich habe mich noch nicht viel mit CSS auseinandergesetzt, und versuche zu übungszwecken Seiten nachzubauen. Die Navigation von http://www.contao-webshop.de/ ist gerade meine aktuelle Herausforderung.

Ich in der CSS-Datei folgende Anweisungen gefunden:

Zitat:

---

.mod_navigationMain{right:0;top:94px;position:abso lute;margin-left:auto;padding-right:30px;}
.mod_navigationMain ul,.mod_navigationMain li{margin:0;padding:0;list-style-type:none;}
.mod_navigationMain li{float:left;}
.mod_navigationMain a{height:16px;display:block;padding:3px 10px;border-left:1px solid #ffffff;text-decoration:none;font-size:12px;color:#ffffff;}
.mod_navigationMain a:hover{height:16px;display:block;padding:3px 10px;background-color:#CCCCCC;border-left:1px solid #ffffff;text-decoration:none;font-size:12px;color:#000000;}
.mod_navigationMain a.trail,.mod_navigationMain span{height:16px;display:block;padding:3px 10px;background-color:#FB8000;border-left:1px solid #ffffff;text-decoration:none;font-size:12px;color:#ffffff;}
.mod_navigationMain li .last,.mod_navigationMain li .last:hover{border-right:1px solid #ffffff;}
#left .mod_navigation{width:200px;margin:0 0 0 30px;padding:10px 0 12px;background:#e5e5e5 url("tl_files/images/subnavi_bg.gif") left bottom no-repeat;}
#left .mod_navigation ul{width:200px;margin:0;padding:0;list-style-type:none;}
#left .mod_navigation a{width:180px;display:block;margin-bottom:1px;padding:5px 0 5px 20px;background:url("tl_files/images/navi_bullet.gif") left center no-repeat;text-decoration:none;font-size:13px;color:#333333;}
#left .mod_navigation a:hover,#left .mod_navigation span{width:180px;display:block;margin-bottom:1px;padding:5px 0 5px 20px;background:#FB8000 url("tl_files/images/navi_bullet.gif") left center no-repeat;text-decoration:none;font-size:13px;color:#ffffff;}
#left .mod_navigation a.trail,#left .mod_navigation .active .submenu{width:180px;display:block;padding:5px 0 5px 20px;background:#FB8000 url("tl_files/images/navi_bullet.gif") left center no-repeat;text-decoration:none;font-size:13px;color:#ffffff;}
#left .mod_navigation .level_2 a{width:170px;display:block;padding:5px 0 5px 30px;background:url("tl_files/images/navi_bullet2.gif") left center no-repeat;text-decoration:none;font-size:13px;color:#333333;}
#left .mod_navigation .level_2 a:hover,#left .mod_navigation .level_2 span{width:170px;display:block;padding:5px 0 5px 30px;background:url("tl_files/images/navi_bullet2.gif") left center no-repeat;text-decoration:none;font-size:13px;color:#FB8000;}
#left .mod_navigation .level_2 a:hover.last,#left .mod_navigation .level_2 span.last,#left .mod_navigation .level_2 a.last{margin-bottom:11px;}
.mod_navigationMain ul.level_1{height:180px;}
.mod_navigationMain .level_1 ul{width:170px;left:-999em;position:absolute;margin-bottom:0;background-color:#808080;}
.mod_navigationMain .level_1 .last ul{width:190px;left:-999em;position:absolute;margin-bottom:0;margin-left:-121px;background-color:#808080;}
.mod_navigationMain li:hover{background-color:#CCCCCC;}
.mod_navigationMain li:hover a{color:#000000;}
.mod_navigationMain .level_2 ul{margin:-27px 0 0 140px;}
.mod_navigationMain ul.level_2{width:190px;border-top:1px solid #ffffff;-webkit-box-shadow: 1px 1px 3px #666666;-moz-box-shadow: 1px 1px 3px #666666;box-shadow: 1px 1px 3px #666666;}
.mod_navigationMain .level_2 li{float:none;background:none;}
.mod_navigationMain .level_2 a{width:170px;display:block;padding:3px 10px;background-color:#CCCCCC;border-right:1px solid #ffffff;border-bottom:1px solid #ffffff;font-size:12px;color:#000000;}
.mod_navigationMain .level_2 a:hover,.mod_navigationMain .level_2 span{width:170px;display:block;padding:3px 10px;background-color:#FB8000;border-right:1px solid #ffffff;border-bottom:1px solid #ffffff;font-size:12px;color:#ffffff;}
.mod_navigationMain li:hover .level_2,.mod_navigationMain .level_2 li:hover .level_3{left:auto;z-index:9999;}

---

und

Zitat:

---

.mod_header_rubrik a{left:50px;top:311px;position:absolute;font-weight:bold;text-decoration:none;font-size:13px;color:#666666;}
.mod_header_rubrik a:hover{left:50px;top:311px;position:absolute;font-weight:bold;text-decoration:none;font-size:13px;color:#FB8000;}

---

Mein Problem ergibt sich aus dem Modul Header Rubrik, ich kann dies nichft finden. Und so fehlt mir in meiner Navigation in der linken Spalte. bzw. sitzt dieses Modul noch im Header, soll aber sugerieren, dass es der hauptpunkt der Navigation der linken Splate ist.

Ist das Modul Header Rubrin eine Erweiterung?

Liebe Grüße

Cristal

Die Rubrik ist nur der Titel der Navigation links. Da zeigt es Dir an in Welchem Hauptmenu Du Dich gerade aufhälst. Also es zeigt Dir im Prinzip als Überschrift der übergeordnete Level1 an.

Das kannst mit einem einfachen Div oder Überschrift nachbauen welchem die Bezeichnung (klasse) rubrik gibst. Es spricht ja auch nichts dagegen wenn Du den Div via Modul und eigenem html machst (wegen der Bezeichnung).
Da rein machst einen Inserttag rein welchen den übergeordneten Seiten-Level anzeigt ... Inserttags findest im Hanbuch.