各行の後に新しい行を作成する方法10フッターのリスト項目

Question

リスト項目を特定の幅の2番目の列に分割して100個のリスト項目を作成すると、5列と20個の未加工項目が作成されます。

何かがhttp://www.huffingtonpost.com/（LINKS）のように見えます

私のCSSは次のとおりです。

.footer-item { 
float: left; 
width: 31%; 
padding-bottom: 10px; 
padding-left: 20px; 
font-size: 14px; 
font-weight: 700; 
text-transform: uppercase; 
} 

.footer-item ul { 
font-size: 12px; 
text-transform: none; 
font-weight: normal; 
} 

そして、私のWordpressのPHPコードは、私は、これが何をしたいと思い

</div> 
<!-- end content-wrap --> 
</div> 
<!-- end main-wrap --> 
<div id="footer"> 
<?php if (!function_exists('dynamic_sidebar') || !dynamic_sidebar("Footer")) : ?> 
<div class="footer-item"> 
<h3>Bookmarks</h3> 
<ul> 
    <?php wp_list_bookmarks('title_li=&categorize=0&limit=10'); ?> 
</ul> 
</div> 
<div class="footer-item"> 
<h3>Monthy Archives</h3> 
<ul> 
<?php wp_get_archives('limit=10'); ?> 
</ul> 
</div> 
<div class="footer-item"> 
<h3>Daily Archives</h3> 
<ul> 
<?php wp_get_archives('type=daily&limit=10'); ?> 
</ul> 
</div> 

<?php endif; ?> 
<div class="clear"></div> 
<div id="subscribe"> 
<h4><img src="<?php bloginfo('template_directory'); ?>/images/feed.png" alt="Subscribe to RSS" /> Subscribe</h4> 
<p>Subscribe to <a href="<?php bloginfo('rss2_url'); ?>">RSS</a> or enter you email to receive newsletter for news, articles, and updates about what's new.</p> 
<form action="http://feedburner.google.com/fb/a/mailverify" method="post" target="popupwindow" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=<?php echo get_option('feedmail'); ?>', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true"> 
    <input type="text" onblur="if (this.value == '') {this.value = 'enter your email...';}" onfocus="if (this.value == 'enter your email...') {this.value = '';}" value="enter your email..." name="semail" id="semail" /> 
    <input type="hidden" value="<?php echo get_option('feedmail'); ?>" name="uri"/> 
    <input type="hidden" name="loc" value="en_US"/> 
    <input type="submit" id="submit" value="Subscribe" /> 
    </form> 
</div> 
<div id="footer_right"> 
<ul> 
    <li> <a href="<?php echo get_option('home'); ?>">Home</a></li> 
    <?php wp_list_pages('title_li='); ?> 
</ul> 
<small> Copyright &copy; <a href="<?php echo get_option('home'); ?>/" class="on"> 
<?php bloginfo('name'); ?> 
</a> <?php echo date("Y",time()+(7*24*60*60)); ?>. All Rights Reserved.</small><br /> 
<small><a href="http://www.wordpress.com/">wordpress</a> theme by <a href="http://www.wordpress.com">wordpress</a></small> </div> 
</div> 
<!-- end footer --> 

<?php } ?> 
<?php wp_footer(); ?> 

Answer 1

です：

http://jsfiddle.net/383uF/4/

#column { 
border:1px solid #ccc; 
-webkit-column-width:15px; 
-moz-column-width:15px; 
column-width:15px; 
width:120px 
} 
li { 
border:1px solid #ccc; 
display:inline-block; 
} 

<div id="column"> 
<ul> 
<li>1 
</li> 
<li>2 
</li> 
<li>3 
</li> 
<li>4 
</li> 

<li>5 
</li> 
<li>6 
</li> 
<li>7 
</li> 
<li>8 
</li> 

<li>9 
</li> 
<li>10 
</li> 
<li>11 
</li> 
<li>12 
</li> 
</ul> 
</div> 

このことができますが、それ以外は詳しく説明してください。:)