+ Antworten
Ergebnis 1 bis 9 von 9

Thema: Horizontale Navigation overflow:hidden

  1. #1
    Benutzer
    Registriert seit
    18.02.2009
    Beiträge
    32

    Horizontale Navigation overflow:hidden

    Hallo,

    Standardmäßig bekommt das div #nav ja ein overflow:hidden für die horizontale Navigation. Zumindest wenn man das template mit dem Builder erstellt.

    Ich brauche relativ häufig ein Dropdownmenü als horizontale Navigation. Durch das overflow:hidden wird das aufgeklappte natürlich versteckt.

    Jetzt meine Frage:
    Warum bekommt das #nav div dieses hidden? Ist das notwendig oder kann ich es weglassen?
    Es wird schon einen Sinn haben, sonst würde es ja nicht durch den Builder erstellt werden und ich möchte ungerne an den "Eckpfeilern" von YAML rumpfuschen. :-)

  2. #2
    YAML Developer Avatar von djesse
    Registriert seit
    22.11.2005
    Beiträge
    2.892

    AW: Horizontale Navigation overflow:hidden

    Hallo,

    Warum bekommt das #nav div dieses hidden? Ist das notwendig oder kann ich es weglassen?
    Weil die bei YAML mitgelieferten Navigationen keine Dropdown-Navigationen sind - damit stellt sich auch die Anforderung ausklappender Inhalte nicht. Benötigt wird die Eigenschaft grundsätzlich zum Einschließen der floatenden Menüpunkte im Elternelement.

    Wenn Du eine andere Menüform bauen willst, brauchst Du selbstverständlich auch selbstverständlich ein angepasstes CSS.

    Es wird schon einen Sinn haben, sonst würde es ja nicht durch den Builder erstellt werden und ich möchte ungerne an den "Eckpfeilern" von YAML rumpfuschen. :-)
    Das ist kein Eckpfeiler von YAML, sondern lediglich ein Menübaustein, den man verwenden kann oder auch nicht. Zur Umsetzung eines Dropdowns fallen mit 3..4 mögliche Ansätze ein, die ich hier nicht alle erklären kann. Am besten schaust Du Dir die Technik von einem der zahlreichen Onlinebeispiele im Netz ab und baust es nach.

    Gruß
    Dirk
    Keine Supportanfragen per PN, Fragen bitte nur im Forum stellen!
    • "Yet Another Multicolumn Layout" ist ein modulares CSS Framework zur Erstellung wirklich flexibler, zugänglicher und responsiver Websites.
    • "Thinkin' Tags" Rapid Prototyping on a production-ready code basis with YAML 4
    • "YAML Builder" A tool for visual layout development of YAML based CSS layouts.
    • "YAML Debug" an assistive code diagnostic tool for web developers.

  3. #3
    Neuer Benutzer
    Registriert seit
    11.02.2010
    Beiträge
    5

    Frage AW: Horizontale Navigation overflow:hidden

    ich versuche gerade mit dem neuesten ymla framework eine dropdown navi einzubauen.

    habe im css folgendes eingetragen:
    #nav {overflow: inherit;}

    aber das dropdown verschwindet immer hinter der main seite.

    wie schaffe ich es das das drop down menü immer an oberster stelle liegt und angezeigt wird?

    hier ein auszug vom code:

    <div id="header" role="banner">
    <div class="page_margins">
    <div class="page">
    <div class="subcolumns">
    <div class="c25l">
    <dnn:LOGO runat="server" ID="dnnLOGO" />
    </div>
    <div class="c75r">
    <div id="nav" role="navigation">
    <dnn:RADMENU runat="server" ID="dnnMENU" EnableEmbeddedSkins="false" Skin="dnn" />
    </div>
    </div>
    </div>
    </div>
    </div>
    </div>

    <div id="main">
    <div class="page_margins">
    <div class="page">
    <div id="col3">
    <div id="col3_content" class="clearfix">
    <div id="ContentPane" runat="server">Col3</div>
    </div>
    <!-- IE Column Clearing -->
    <div id="ie_clearing"></div>
    </div>
    <div id="col1">
    <div id="col1_content" class="clearfix">
    <div id="RightPane" runat="server">Col1</div>
    </div>
    </div>
    </div>
    </div>
    </div>
    danke

  4. #4
    Erfahrener Benutzer
    Registriert seit
    26.05.2008
    Beiträge
    791

    AW: Horizontale Navigation overflow:hidden

    Für qualifizierte Antworten sind Links zu der Problemseite immer äußerst hilfreich.
    amazingBytes® - www.amazingBytes.net
    Internet-Konzepte & Webdesign • Content Management
    Suchdienstoptimierung • Suchdienstmarketing • Social Media Monitoring • Social Media Optimization

  5. #5
    Neuer Benutzer
    Registriert seit
    11.02.2010
    Beiträge
    5

    AW: Horizontale Navigation overflow:hidden

    dsa ist der link zur seite:

    http://cms6.tscheppe.at/

    beim menüpunkt produkte klappen die unterpunkte auf, aber leider unter dem main bereich.

  6. #6
    Erfahrener Benutzer
    Registriert seit
    26.05.2008
    Beiträge
    791

    AW: Horizontale Navigation overflow:hidden

    Ich kann da nur einen Unterpunkt entdecken, ist das richtig?

    Ändere einmal versuchsweise in deiner basemod.css die Zeile 56 und zwar gibst du dort #nav noch ein overflow:visible - dann schauen wir mal, ob es auch in den IE funktioniert, beim FF tat's jedenfalls
    amazingBytes® - www.amazingBytes.net
    Internet-Konzepte & Webdesign • Content Management
    Suchdienstoptimierung • Suchdienstmarketing • Social Media Monitoring • Social Media Optimization

  7. #7
    Neuer Benutzer
    Registriert seit
    11.02.2010
    Beiträge
    5

    AW: Horizontale Navigation overflow:hidden

    ich habe jetzt 5 unterpunkte angelegt und overflow auf visible gestellt.

    aber in allen browser, IE, chrome und FF bleibt das klappmenü hinter dem main bereich und legt sich nicht darüber.

  8. #8
    Erfahrener Benutzer
    Registriert seit
    26.05.2008
    Beiträge
    791

    AW: Horizontale Navigation overflow:hidden

    Das ist nur ein Browser-Cache-Problem - leere deinen Cache und es funktioniert - soeben getestet in FF5, IE7 und IE8.

    Jetzt setzt du auch noch in Zeile 45 der basemod.css den overflow für #header auf visible und dann werden die aufklappenden Unterpunkte auch nicht an der Grenze header/main abgeschnitten
    amazingBytes® - www.amazingBytes.net
    Internet-Konzepte & Webdesign • Content Management
    Suchdienstoptimierung • Suchdienstmarketing • Social Media Monitoring • Social Media Optimization

  9. #9
    Neuer Benutzer
    Registriert seit
    11.02.2010
    Beiträge
    5

    AW: Horizontale Navigation overflow:hidden

    das overflow im header wars. jetzt klappt es bei mir auch einwandfrei.
    vielen dank

+ Antworten

Lesezeichen

Berechtigungen

  • Neue Themen erstellen: Nein
  • Themen beantworten: Nein
  • Anhänge hochladen: Nein
  • Beiträge bearbeiten: Nein