Ankündigung

Einklappen
Keine Ankündigung bisher.

[Erledigt] Div wird nicht wie gewollt angezeigt

Einklappen

Neue Werbung 2019

Einklappen
X
  • Filter
  • Zeit
  • Anzeigen
Alles löschen
neue Beiträge

  • [Erledigt] Div wird nicht wie gewollt angezeigt

    Hallo habe Folgendes Problem, die Div Hauptmenueclass ist nicht inner halb meines header div's, trotzdem ich die Div relative gesetzt habe.

    Code:
    <div id='header'>
          <h1>Titel</h1>
        
    <div class="Hauptmenueclass"><ul id="menu-hauptmenue" class="menu"><li id="menu-item-9" class="menu-item menu-item-type-custom menu-item-object-custom current-menu-item current_page_item menu-item-home menu-item-9"><a href="">Startseite</a></li>
    <li id="menu-item-10" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-10"><a ">Beispiel-Seite</a></li>
    <li id="menu-item-11" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-11"><a href="http://google.de">google</a></li>
    <li id="menu-item-16" class="menu-item menu-item-type-post_type menu-item-object-page current-menu-item page_item page-item-14 current_page_item menu-item-16"><a href="">blabla</a></li>
    </ul></div>  
    </div>
    css:
    Code:
    body        {margin: 0px; padding: 0px; color: #333; background: #e5e5e5; }
    #wrapper    {width: 850px; margin: auto; text-align: left; background: #fff;}
    #header     {height: auto; padding: 20px; }
    #main       {width: 520px; padding: 20px; float: left;}
    #sidebar    {width: 270px; padding: 10px; padding-top: 20px; float: left;}
    #footer     {clear: both; height: 100px; padding: 20px; }
    .Hauptmenueclass {
         margin-left:0px; ;
         margin-right:auto;
         border-left-width:0px; ;
         padding-left:0px; ;
         text-align:left;
         position: relative;
    }
    
    .menu {
         margin-left:0px; ;
         margin-right:auto;
         border-left-width:0px; ;
         padding-left:0px; ;
         text-align:left;
    
    }
    
    .Hauptmenueclass li {
        float: left;
        position: relative;
    
    }
    
    
    .Hauptmenueclass a {
      color: #eee;
      text-decoration: none;
      float: left;
      line-height: 40px; padding: 0 8px; margin: 0px;
      border-top-left-radius: 12px;
      border-top-right-radius: 12px;
    }
    
    .Hauptmenueclass a:first-child {
    margin-left: none;
    }
    
    .Hauptmenueclass a:hover, .Hauptmenueclass .current-menu-item a, .Hauptmenueclass .current-menu-parent a {
      background: #8b9b87
      url(img/hover.png) repeat-x;
      color: #2B3A27;
      font-weight: normal;
    }
    
    .Hauptmenueclass li:hover {
        background: #8b9b87
        url(img/hover.png) repeat-x;
    }
    
    .Hauptmenueclass .sub-menu {
      padding: 0 px 0; margin: 0;
      list-style: none;
      position: absolute; top: -999px; opacity: 0;
      background: #a1ad9e;
    }
    
    .sub-menu li {
        float: none;
        display: block;
        position: static;
        padding-bottom: 1px;
    }
    
    .Hauptmenueclass li:hover .sub-menu {
        background: #8b9b87;
        top: 40px; opacity: 1;
        transition: opacity .4s ease-in-out;
    }
    
    .Hauptmenueclass .sub-menu a {
        padding: 0px 10px; margin: 0; display: block;
        float: none;
        line-height: 1.5;
        background: none; color: #2b3a27;
        white-space: nowrap;
    }
    
    .Hauptmenueclass li ul a:hover {
        color: #eee;
        background: #425c3b;
    }


  • #2
    das kenne ich nicht
    PHP-Code:
    <"> 

    Kommentar


    • #3
      Zitat von kaminbausatz Beitrag anzeigen
      das kenne ich nicht
      PHP-Code:
      <"> 
      da steht ein :href="url"
      Ich hatte die verlinkungen nur rausgenommen, da sie noch mehr Platz einem. Es geht rein um die Struktur und dass das Div auf der Seite außerhalb des Head-Divs liegt. Alle Elemente innerhalb der Hauptmenueclass werden vom CMS selbst erzeugt.

      Kommentar


      • #4
        Ach so,

        keine Ahnung, was Du meinst, das DIV ist im DIV - wahrscheinlich ist line-height: 40px Dein Problem.

        Kommentar


        • #5
          Also Das Div Header wird Angezeigt und im Baum ist auch alles soweit ok. Allerdings ist das Div nicht innerhalb des Div's bei der Anzeige, sonder Wird darunter angzeigt und überscheidet sich dadurch mit dem Border. Und nein 40 px ist nicht das Problem !

          Kommentar


          • #6
            dann lösche es mal....

            Kommentar


            • #7
              Was soll das, wenn ich sage das liegt nicht daran, wieso soll ich es dann löschen? Wenn ich das rausnehme ist die höhe des Menüs falsch, das ist alles.

              Kommentar


              • #8
                Kann alles bleiben wie es ist, füge #header noch "display: inline-block;width: 100vw;" hinzu ... (ja, vw (viewwidth; vh - viewhight gibts auch ))

                Kommentar


                • #9
                  Du würdest es übrigens alles etwas leichter machen dir zu antworten, wenn du zB ein fiddle (hier dein Beispiel) mit deinen Daten erstellen würdest (mit korrektem HTML ). Erhöht bestimmt auch die Wahrscheinlichkeit auf Antworten.
                  Debugging: Finde DEINE Fehler selbst! | Gegen Probleme beim E-Mail-Versand | Sicheres Passwort-Hashing | Includes niemals ohne __DIR__
                  PHP.de Wissenssammlung | Kein Support per PN

                  Kommentar


                  • #10
                    Zitat von Skaduro Beitrag anzeigen
                    Was soll das, wenn ich sage das liegt nicht daran, wieso soll ich es dann löschen? Wenn ich das rausnehme ist die höhe des Menüs falsch, das ist alles.
                    Wenn ich es nicht ausprobiert hätte, hätte ich es nicht gepostet. Du wolltest verhindern, dass die Menüpunkte unterhalb #header erscheinen. Ansonsten ist Dein Ton nicht ganz passend...

                    Kommentar


                    • #11
                      Zitat von kaminbausatz Beitrag anzeigen
                      Wenn ich es nicht ausprobiert hätte, hätte ich es nicht gepostet. Du wolltest verhindern, dass die Menüpunkte unterhalb #header erscheinen. Ansonsten ist Dein Ton nicht ganz passend...

                      Ich habe es auch getestet und es blieb außerhalb und war dann nur kleiner. Hatte das auch scho zuvor getestet. Ich habe auch schon alle Styles bis auf float rausgenommen um zu testen. Weshalb ich beim zweitenmal den Tip als unnötig emfand, denn hätte ich es nicht getestet, hätte ich nicht geschrieben das es daran nicht liegt.

                      Zitat von der_robert Beitrag anzeigen
                      Kann alles bleiben wie es ist, füge #header noch "display: inline-block;width: 100vw;" hinzu ... (ja, vw (viewwidth; vh - viewhight gibts auch ))
                      thx, das war die Lösung

                      Zitat von hausl Beitrag anzeigen
                      Du würdest es übrigens alles etwas leichter machen dir zu antworten, wenn du zB ein fiddle (hier dein Beispiel) mit deinen Daten erstellen würdest (mit korrektem HTML ). Erhöht bestimmt auch die Wahrscheinlichkeit auf Antworten.
                      werde ich mir beim nächsten mal zu herzen nehmen

                      Kommentar

                      Lädt...
                      X