2010-12-13 9 views
2

2つの列に収まるリストを持つページを構築する必要があります。このリストはPHPによって生成されるので、簡単に入力を追加する必要があります。有効なXHTML/CSSで2列のリストをどのようにすることができますか?

それはしたいはずです。

* Lorem Ipsum   * Lorem Ipsum 
* Lorem Ipsum   * Lorem Ipsum 
* Lorem Ipsum   * Lorem Ipsum 
* Lorem Ipsum   * Lorem Ipsum 
* Lorem Ipsum   * Lorem Ipsum 

私は​​と<li />の基本的な構造でこれを生成するためのいくつかの方法があるかどうかを知りたい:

<ul> 
    <li>Lorem Ipsum</li> 
    <li>Lorem Ipsum</li> 
    <li>Lorem Ipsum</li> 
    <li>Lorem Ipsum</li> 
    <li>Lorem Ipsum</li> 
</ul> 

私は大きなをサポートする必要がありますブラウザー(IE7,6はサポートされていません)。

ありがとうございます!私はこの解決策を見つけた

答えて

2

ul li { 
    margin: 0; 
    padding: 0; 
    width: 50%; 
    float: left; 
} 
+0

すごいああ、実際にはかなりうまく機能:それはそれはほとんどのブラウザで動作させることができても利用できるのjavascriptがあります! –

2

としてはhereを説明し、それを行うための簡単な方法は、リストとその項目に明示的な幅を与え、アイテムを左にフロートさせることです。

ul { 
    width: 700px; 
} 

li { 
    width: 200px; 
    float: left; 
} 
0

あなたはCSS3の複数列のプロパティを探しています。残念ながら、CSS3の仕様で提供されている多くのクールな機能とは異なり、ほとんどのブラウザはこれをまだサポートしていません。

http://www.alistapart.com/articles/css3multicolumn/

関連する問題