Sven Schultschik (LDA): Dropdown Menu

Hi,

ich hab ein Menü mit CSS ala Selfhtml Erläuterung gemacht,
hat bis jetzt alles wunderbar geklappt nur ich bekomm den .....
einfach nicht zentriert.

kann sich dat vl ma jemand anschaun oder mir sagen wat ich tun soll??

http://www.lorddarkangel.de/www/menu.html
http://www.lorddarkangel.de/www/menu.css

Danke Sven

  1. Lieber Sven,

    ich hab ein Menü mit CSS ala Selfhtml Erläuterung gemacht

    Na, nicht so ganz... Du verwendest die ID "Buttons" sehr häufig. IDs sind _einmalig_ zu vergeben. Das wäre so, als ob ganz viele Menschen einunddenselben Personalausweis ausgefertigt bekämen - irgendwie sinnfrei, oder?

    Du möchtest eine CSS-Klasse namens "Buttons" einrichten und anstelle der multiplen ID verwenden.

    Selbiges gilt ebenso für "Unternavigation".

    Wozu ist eigentlich das DIV um die <ul id="Navigation"> gut? Nur des "Rahmens" wegen? Den kannst Du per CSS auch der UL selbst geben. Sinnvoll wäre das DIV, wenn der UL eine Überschrift vorausginge... wie das bei einem vernünftigen Dokument eben so ist: Es beginnt mit einer Überschrift.

    nur ich bekomm den .....
    einfach nicht zentriert.
    http://www.lorddarkangel.de/www/menu.css

    In Deinem Stylesheet "zentrierst" Du Deine Navi ja auch nicht... Dort steht:

    ul#Navigation {  
        margin: 0; padding: 0;  
        text-align: center;  
    }
    

    Wenn Du ein Block-Element mittig darstellen willst, dann musst Du seinen rechten und linken Rand auf "auto" stellen! Hier stellst Du beides auf Null.

    Liebe Grüße aus Ellwangen,

    Felix Riesterer.

    1. Hi

      »»Du verwendest die ID "Buttons" sehr häufig.irgendwie sinnfrei, oder?

      Ok das kug ich mir nochmal an.

      Wozu ist eigentlich das DIV um die <ul id="Navigation"> gut? Nur des "Rahmens" wegen?

      Weil ich das Menu in nem extra file lassen wollte und dann in dass hauptdkument einbinden und dachte so würd ich mir seinfacher machen.
      bzw aus der menu html noch eine header html werden soll

      Du seinen rechten und linken Rand auf "auto" stellen!

      ahhh... da kann ich lang mit center etc experimentieren. Und dat wichtigste hab ich übersehen. Danke

    2. Hi,

      mist furnktioniert trotzdem noch nich mitm zentrieren.

      Sven

      1. Moin

        mist furnktioniert trotzdem noch nich mitm zentrieren.

        klingt so als würdest du mit dem IE testen. Der hat da einen kleinen Bug. Daher musst du für diesen Sch...-Browser zusätzlich im übergeordneten Element text-align:center angeben, obwohl es sich gar nicht um Text dreht.

        Gruß
        rfb

        1. Moin

          klingt so als würdest du mit dem IE testen.

          Nein ich teste nicht mit dem IE. Ich teste mit FF 2.0 und wenns da fertig ist, wird für IE gefixt.

          Hier nochmal der link zur css: http://www.lorddarkangel.de/www/menu.html
          http://www.lorddarkangel.de/www/menu.css

      2. Lieber Sven,

        ich lese nun in Deinem Stylesheet folgendes:

        ul#Navigation {  
            margin:auto; padding:auto;  
            text-align: center;  
        }
        

        Damit setzt Du zwar auch den oberen und unteren Rand auf "auto", aber das ignoriere ich jetzt, um die Sache nicht unnötig auszuweiten.

        Wie breit ist denn Dein <ul>-Element? Wenn es die gesamte verfügbare Breite einnimmt (und das scheint es zu tun, teste es, indem Du ihm einen roten border verleihst!), dann nützt Dir das margin:auto recht wenig.

        Gibt Deinem <ul>-Element eine feste Breite (wegen der Grafiken sollte das ja kein Problem sein, da der User den sichtbaren Text deshalb nicht größer oder kleiner schalten kann), damit auch tatsächlich ein Rand entsteht, den der Browser dann automatisch einstellen kann!

        ul#Navigation {  
            border: 3px solid red; /* nur zum Testen! */  
            width: 400px; /* nur ein "erfundener" Wert - miss Dein Menü bitte selbst aus */  
            margin: auto;  
            padding: 0; /* hier besser kein "auto" sondern Null... */  
            text-align: center; /* das verstehe ich jetzt nicht (überflüssig?), aber Du wirst schon wissen, was Du hier tust */  
        }
        

        Liebe Grüße aus Ellwangen,

        Felix Riesterer.

        1. Hi

          ok??

          Damit setzt Du zwar auch den oberen und unteren Rand auf "auto", aber das ignoriere ich jetzt, um die Sache nicht unnötig auszuweiten.

          Ahh dass Ding hab ich ma übersehen.

          Wie breit ist denn Dein <ul>-Element?

          So Danke jetzt isses schön zentriert :)

          Und es kann weitergehen.

          Thx