Zentrieren von div in li in der css

Ok, wirklich einfach, ich weiß aber nicht für mich... ich kann es nicht herausfinden!

<ul>
  <li>Hi</li>
  <li>Hello World
    <div>Hello again</div>
  </li>
  <li>Hola</li>
</ul>

Muss ich die Mitte des div in li passend mit der Mitte des li. Jetzt richtet er mit der linken Seite und linken Seite. Ich weiß, dass es eine einfache Lösung für dieses, aber ich kann einfach nicht finden!! Ich brauche Sie, um ein div-Element und nicht eine li. Bitte jede Hilfe wird sehr geschätzt. Danke an alle und jeden im Voraus!

Hier ist das kleine Stück von css, die ich jetzt habe:

 #show li{float: left;
          padding: 10px;
          width: 100px;
          display: block;}
    .sub{position: absolute; 
         display: block; 
         background: #333;
         color: white; 
         width: 910px;
         margin: 0 auto;}

Div ist ein Dropdown bei mouseover mit den jquery, aber ich brauche das div größer sein, als die li, es ist die linke Seite ist die Ausrichtung an der linken Seite der li, ich brauche die gesamte div-center unter der li. Ich hoffe, das macht Sinn. Die margin 0 auto funktioniert nicht.

Kann nicht wirklich sagen, ohne CSS, aber versuchen Sie es mit margin:0 auto auf die div. Hinzufügen von position:relative, um das übergeordnete li.
Können Sie Ihre bestehende CSS? demo, würde auch helfen. Gerade jetzt, es ist nicht klar, warum Sie können nicht nur hinzufügen text-align: center zu den div.
Ich habe es oben... danke!
Wie funktioniert das CSS match-up mit Ihrem HTML? Nichts in deinem HTML hat eine Klasse .sub zum Beispiel. Wenn Sie eine demo - (jsfiddle.net oder jsbin.com) von deinem problem, es wird viel leichter sein, Ihnen zu helfen.

InformationsquelleAutor luv2code | 2012-01-26

  1. 3

    Gib dem div eine Klasse, wie diese: 

    <div class="someClass">Hello again</div>

    Dann geben Sie ihm eine Breite, die kleiner als die Breite der li und hinzufügen "margin:auto" zentriert:

    .someClass { width: 80%; margin:auto }

    InformationsquelleAutor Clay Garrett

Schreibe einen Kommentar