CSSで中央揃えの左揃えの可変幅の箇条書きリストを作成するにはどうすればよいですか？

Question

どういうわけか、左揃えリストの中央揃えが可能ですか？同様に、リスト自体を中心にしたいが、箇条書きの点が互いに下に並ぶようにしたい。

リストに固定幅とマージンを指定すると、並べ替えることができますが、コンテンツの幅がわからないので、実際には幅を設定したくありません。

Answer 1

ulではdisplay: inline-block、親要素ではtext-align: centerを使用してください。

を参照してください：http://jsfiddle.net/thirtydot/E3Yjr/

はCSS：

.list-container { 
    text-align: center; 
} 
ul { 
    display: inline-block; 
    text-align: left; 
} 

HTML：

<div class="list-container"> 
    <ul> 
     <li>Item 1</li> 
     <li>Item 2</li> 
     <li>Item 3</li> 
     <li>Item 4</li> 
     <li>Item 5</li> 
     <li>Item Looooooooooooooooooooooooonggg</li> 
    </ul> 
</div> 

あなたはwork in IE7にそれを必要とする場合は、ここに方法は次のとおりです。http://jsfiddle.net/thirtydot/E3Yjr/1/

display: inline-block; 
*display: inline; 
zoom: 1;