Wrap a list to the right
If i had a list like the following:
<ul>
<li>Alex</li>
<li>James</li>
<li>Thomas</li>
<li>Is</li>
<li>Asking</li>
<li>Questions</li>
<li>On</li>
<li>Stackoverflow</li>
</ul>
The default will be displayed like:
* Alex
* James
* Thomas
* Is
* Asking
* Questions
* On
* Stackoverflow
What CSS would i use to get it to display like:
* Alex * Questions
* James * On
* Thomas * St开发者_如何学运维ackoverflow
* Is
* Asking
Thanks in advance...
For modern browsers
ul{
-ms-column-count: 2;
-o-column-count: 2;
-moz-column-count: 2;
-khtml-column-count: 2;
column-count: 2;
}
If you would like set width
for every <li>
and lost order of elements, here is demo: http://jsfiddle.net/dpXz2/
li{
display: block;
float: left;
width: 75px;
}
ul{
width: 150px;
}
Afaik this is not possible with CSS2. Especially if you want to keep the order like you mentioned it.
However there is a jQuery Plugin that does exactly what you descripted.
http://www.christianyates.com/blog/mmm-geeky/multi-column-lists-jquery-alternative-method
精彩评论