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 * Stackoverflow
* 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;
}
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With