css - Floating multiple li's left and right -


i trying make custom sidebar in wordpress, have element , info in li's, trying try shift half of total li's left , half right...

what using float/clear left , right, not seems work wanted...

html structure:-

<ul>     <li class="left">left</li>     <li class="left">left</li>     <li class="left">left</li>     <li class="left">left</li>     <li class="left">left</li>     <li class="right">right</li>     <li class="right">right</li>     <li class="right">right</li>     <li class="right">right</li>     <li class="right">right</li> </ul> 

the css:-

.left { float:left; width:50%; clear:left; } .right { float:right; width:50%; clear:right } 

jsfiddle

if you're willing give list style disc (depending on browser), can without floats or modifying markup.

http://jsfiddle.net/duejc/2/

ul {     -webkit-columns: 2;     -moz-columns: 2;     columns: 2; } 

Comments

Popular posts from this blog

Delphi XE2 Indy10 udp client-server interchange using SendBuffer-ReceiveBuffer -

Qt ActiveX WMI QAxBase::dynamicCallHelper: ItemIndex(int): No such property in -

Enable autocomplete or intellisense in Atom editor for PHP -