nav unter header

  • Hallo liebe Community
    Ich habe versuche momentan mit html und css anzufangen und für einen kleinen Verein von mir eine Website zu bauen.
    Nun habe ich damit angefangen nachdem ich mir das ein oder andere Tutorial durchgelsen oder angesehen habe diese zu basteln
    nun habe ich allerdings das problem das sich meine nav unter dem header befindet
    Ich Verlinke hier auch mal ein paar bilder
    Ich hoffe ihr könnt mir hierbei helfen danke ich vorraus


  • Warum schreibst du dann den Code für die Navigation nicht einfach dahin, wo er hin soll?
    Der Browser arbeitet den Code sequentiell ab und stellt die Elemente in der Reihenfolge dar, wie sie im Code stehen - es sei denn, du legst im CSS was anders fest.

  • So ganz erschließt sich die Idee, die hinter deinem Layout steckt, mir nicht :).
    Du hast 'position: fixed;' für deine <section> und schiebst sie dann mit 'left: 50%;' und 'transform: translate(-50%,-50%);' hin und her?? Lass doch den Browser sein Ding machen und verzichte auf diese 'Zwangsmaßnahmen', die dich ja anscheinend auch jetzt an anderer Stelle mehr behindern als nutzen.
    Teste das, was ich empfohlen habe... Logo und NAV im Code über die <section>


    und notiere für <section> folgendes im CSS

    HTML
    1. section {
    2. height: 160px;
    3. width: 100%;
    4. background: #151515;
    5. box-shadow: 0 25px 30px rgba(0,0,0,.5);
    6. display: flex;
    7. }


    Und von da aus kannst du dann an deinem Design weiter feilen.

  • Da bist du mit deinem Layout auf dem falschen weg - wenn du die Navigation in einem anderen div haben willst - zB die Navigation im Container 'ImageBox', dann solltest du den Code dafür auch in den Container hineinschreiben.


    Dazu dann noch etwas CSS um die Elemente so zu formatieren, dass es deinen Wünschen entspricht... zB

    HTML
    1. .navbar ul {
    2. list-style: none;
    3. }
    4. .navbar li {
    5. display: inline-block;
    6. }


    Den Rest solltest du dann wohl selber hinbekommen.