distribuir igualmente la lista ul a través de div

Parece que no puedo entender por qué esto funciona:

#inside-footer {
    display: inline-block;
    margin-left: auto;
    margin-right: auto;
    font-size: 85%;
}
#inside-footer ul.footer_nav {
    text-align: left;
    float: left;
    margin: 20px 10px;
    position: relative;
    width: 164px;
}

<div id="inside-footer">
      <ul class="footer_nav">
        <h4>Zeigeist</h4>
        <li>
          <a href="/es/;about">About</a>
        </li>
        <li>
          <a href="/es/blog">Blog</a>
        </li>
        <li>
          <a href="/es/;contact">Contact &amp; Support</a>
        </li>
        <li>
          <a href="/es/training">Training</a>
        </li>
        <li>
          <a href="#">Site Status</a>
        </li>
      </ul>
      <ul class="footer_nav">
        <h4>Tools</h4>
        <li>
          <a href="/es/;create">Chapter Generator</a>
        </li>
        <li>
          <a href="#">Activies Board</a>
        </li>
      </ul>
      <ul class="footer_nav">
        <h4>Documentation</h4>
        <li>
          <a href="#">Chapter Sites</a>
        </li>
        <li>
          <a href="#">Developers</a>
        </li>
      </ul>
      <ul class="footer_nav">
        <h4>External Links</h4>
        <li>
          <a href="#">News</a>
        </li>
        <li>
          <a href="#">Media</a>
        </li>
      </ul>    <!-- /upper-footer-->
  </div><!-- /inside-footer -->​

pero en mi sitio http://zmgc.net/ los elementos de la lista están al otro lado, y no debajo de las etiquetas de encabezado.

Me gustaría mostrarlo como http://jsfiddle.net/ypr8g/13/ pero distribuidos equitativamente dentro del div yui3-u-19-24 y tal vez pueda dividir esto con otro yui3-g y poner cada uno dentro de un div yui3-u-1-4, ¡pero no parece correcto!

¿Qué me estoy perdiendo?

gracias

preguntado el 02 de mayo de 12 a las 19:05

1 Respuestas

Donde tienes #inside-footer li { float: left; margin-top: 5px; padding: 0; } necesita sacar el flotador ya que esto muestra los li's uno al lado del otro, cámbielo a #inside-footer li { margin-top: 5px; padding: 0; } y se mostrará como lo desee, es decir, debajo de las etiquetas de encabezado.

contestado el 02 de mayo de 12 a las 19:05

gracias, pero ¿hay alguna manera de distribuir equitativamente las 4 listas en el div? - khinester

Si cambia su # div a lo siguiente, debería funcionar inside-footer ul.footer_nav { text-align: left; flotador izquierdo; margen: 20px 0; ancho: 283px; } necesitas darle a la ul un ancho - frontendzzzguy

No es la respuesta que estás buscando? Examinar otras preguntas etiquetadas or haz tu propia pregunta.