[Solved] Yaml: Problem beim Einbau eines .css-Menüs

Begonnen von Break_Dancer, 30 April 2010, 18:58:04

⏪ vorheriges - nächstes ⏩

0 Mitglieder und 1 Gast betrachten dieses Thema.

Break_Dancer

Hallo,

muss leider mal wieder eine Baustelle aufmachen. Derzeit baue ich auf einer meiner Seiten das hier in den Downloads verfügbare YAML-Theme ein. Das lief bereits längere Zeit auf einer anderen Seite und hat mich begeistert.

Zur Sache: Da mir das Headermenü nicht ausreichend war, habe ich mir von hier: http://www.cssplay.co.uk/menus/drop_examples.html das Menü Nummer 4 ausgesucht und wie folgt eingebaut:

index.html:

<h1>
            <a href="./">{PAGE_TITLE}</a>
          </h1><span>{PAGE_SLOGAN}</span>
        </div>
       
<div class="container4">
         <div class="menu4">
         <ul>
        <li class="home"><a href="#nogo">Home</a></li>
        <li class="products"><a class="drop" href="#nogo">Products<!--[if IE 7]><!--></a><!--<![endif]-->
        <!--[if lte IE 6]><table><tr><td><![endif]-->
        <ul>
                <li class="subprod"><a href="#nogo">Mobiles</a></li>

                <li class="subprod2"><a href="#nogo">Photoframes</a></li>
                <li class="subprod2"><a href="#nogo">Tripods</a></li>
                <li class="subprod"><a href="#nogo">Memory cards</a></li>
                <li class="subprod3"><a class="drop" href="#nogo">Cameras<!--[if IE 7]><!--></a><!--<![endif]-->
                <!--[if lte IE 6]><table><tr><td><![endif]-->
                <ul>
                        <li class="subsubl"><a href="#nogo">SLRs</a></li>

                        <li class="subsubl"><a href="#nogo">Compact</a></li>
                        <li class="subsubl"><a href="#nogo">Digital</a></li>
                        <li class="subsubl"><a href="#nogo">Video</a></li>
                </ul>
                <!--[if lte IE 6]></td></tr></table></a><![endif]-->
                </li>
                <li class="subprod2"><a href="#nogo">Camcorders</a></li>

                <li class="subprod"><a href="#nogo">Accessories</a></li>
        </ul>
        <!--[if lte IE 6]></td></tr></table></a><![endif]-->
        </li>
        <li class="services"><a class="drop" href="#nogo">Services<!--[if IE 7]><!--></a><!--<![endif]-->
        <!--[if lte IE 6]><table><tr><td><![endif]-->
        <ul>
                <li class="subserv4"><a href="#nogo">Photography</a></li>

                <li class="subserv3"><a href="#nogo">Video editing</a></li>
                <li class="subserv"><a href="#nogo">Web site Design and Hosting</a></li>
                <li class="subserv5"><a href="#nogo">Reference guides</a></li>
                <li class="subserv2"><a href="#nogo">Tutorials</a></li>
        </ul>
        <!--[if lte IE 6]></td></tr></table></a><![endif]-->
        </li>

        <li class="contact"><a href="#nogo">Contact us</a></li>
        <li class="site"><a href="#nogo">Site Map</a></li>
        <li class="news"><a class="drop" href="#nogo">News<!--[if IE 7]><!--></a><!--<![endif]-->
        <!--[if lte IE 6]><table><tr><td><![endif]-->
        <ul>
                <li class="subnews3"><a href="#nogo">Breaking</a></li>
                <li class="subnews"><a href="#nogo">Latest</a></li>

                <li class="subnews"><a href="#nogo">May 2006</a></li>
                <li class="subnews2"><a class="drop" href="#nogo">News Archives and Articles<!--[if IE 7]><!--></a><!--<![endif]-->
                <!--[if lte IE 6]><table><tr><td><![endif]-->
                <ul class="left">
                        <li class="subsubr"><a href="#nogo">April 2006</a></li>
                        <li class="subsubr"><a href="#nogo">March 2006</a></li>
                        <li class="subsubr"><a href="#nogo">February 2006</a></li>

                        <li class="subsubr"><a href="#nogo">January 2006</a></li>
                </ul>
                <!--[if lte IE 6]></td></tr></table></a><![endif]-->
                </li>
        </ul>
        <!--[if lte IE 6]></td></tr></table></a><![endif]-->
        </li>
</ul>
</div>

</div>

        <!-- begin: main content area #main -->
        <!-- START comment -->


Den zugehörigen .css-Code habe ich in eine Datei "menu4.css" gepackt und in den Style-Ordner hochgeschoben. Eingebunden wird diese nun über die style.css:

@import url(../style/menu4.css);

Schaut euch bitte mal das Ergebnis an: http://bayern-kirmes.de.

Da gibt es Probleme bei der Darstellung bei Drop-Down, bitte einfach mal ausprobieren.

Hat jemand spontan eine Idee, woran es liegt ? Die fehlenden Bilder sind es nicht, die hatte ich vorhin schon mal rausgenommen.  ;)

Grüße

Markus


Break_Dancer

Erledigt. War ein Problem mit dem Pfad zur .css-Datei. Absoluter Pfad passt und funktioniert jetzt - und ein anderes Menü hab ich auch drin.

Wenn ich jetzt noch wüsste, an welcher Stelle ich genau das Layout auf 2-spaltig umschalten kann, könnte es ab in die heisse Phase gehen.

Grüße

Markus