List Style 2 Kolom

membuat widget sidebar menjadi 2 kolom..

Pertama-tama cari tag ]]></b:skin>
Lalu pastekan script dibawah sebelum tag itu

/* Kode Css List Two Kolom
——————————————————————————————*/
#catl {
padding :5px 10px;
width : 91%;
background-color : #ffffdd;
border : 1px solid #ccc;
margin : auto;
}

#catl h3 {
display : block; color : #669900; padding-bottom : 5px;
margin-bottom : 5px; border-bottom : 1px solid #666;font-size:14px; }

/* style all the list items here */
#catl ul li {
height : 1em;
list-style-type : none;
color : #333;
padding : 0.3em 0 0.4em 0.25em;
font-size : 0.9em;
border-bottom : 1px solid #ccc;
text-indent:0px;
}

/* every second list item is positioned outward and moved up equal to LI height to even them */
#catl ul li.catl_l2 {
margin-left : 50%;
margin-top : -1.8em;
padding : 0.3em 0 0.4em 0.5em;
border : 0;
}

/* Every other two list items are styled with a background for usability and style */
.catl_alt {
background-color : #fffffc;
}

/* ini merupakan code hacking css untuk Ie 6*/
* html #catl ul li.catl_l2 {
margin-top : -2.3em;
}

Jangan lupa di save
Masuk lagi menu Page Element
Tambah elemen HTML/JavaScript lalu isi dengan script di bawah ini lalu Save

<div id=”catl”>
<h3>Satu List Dua Kolom</h3>
<ul>
<li><a href=”#”>List Item Satu</a></li>
<li><a href=”#”>List Item Dua</a></li>
<li class=”catl_alt”>List Item Tiga</li>
<li class=”catl_l2″>List Item Empat</li>
<li>List Item Lima</li>
<li>List Item Enam</li>
<li >List Item Tujuh</li>
<li class=”catl_l2″>List Item Delapan</li>
</ul>
</div>

Beres deh..


Bookmark & Share