2012-05-02 20 views
0

渡っULリストを配布する:均等に私はこの作業の理由を把握することができないようdivの

#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="/;about">About</a> 
     </li> 
     <li> 
      <a href="/blog">Blog</a> 
     </li> 
     <li> 
      <a href="/;contact">Contact &amp; Support</a> 
     </li> 
     <li> 
      <a href="/training">Training</a> 
     </li> 
     <li> 
      <a href="#">Site Status</a> 
     </li> 
     </ul> 
     <ul class="footer_nav"> 
     <h4>Tools</h4> 
     <li> 
      <a href="/;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 -->​ 

が、私のサイトhttp://zmgc.net/上のリスト項目はなく、ヘッダータグの下に越えています。

http://jsfiddle.net/ypr8g/13/のように表示したいと思いますが、yui3-u-19-24 div内に均等に分散されています。これを別のyui3-gで分割し、それぞれをyui3-u-1-4 divしかし右のように見えません!

何が欠けていますか?

おかげであなたは#inside-footer li { float: left; margin-top: 5px; padding: 0; }を持って

答えて

2

これは並んで李の側面を表示するよう、#inside-footer li { margin-top: 5px; padding: 0; }に変更して撮影したフロートを必要とし、あなたはすなわち、ヘッダータグの下にそれをすると、それが表示されます。

+0

ありがとうございますが、divに4つのリストを均等に配布する方法はありますか? – khinester

+0

#divをinside-footer ul.footer_nav {text-align:left;}内で動作するように変更した場合、 float:left; margin:20px 0;幅:283px; }あなたはulの幅を与える必要があります – frontendzzzguy

関連する問題