Jump to content

is it possible? Find the number of list items and split into 2 cols


peppericious

Recommended Posts

I have a "vocab list" on a page in the form of a ul with li items.

The number of vocab entries (li items) varies. I'd like to display the vocab in two adjacent columns.

 

For argument's sake, suppose there are 19 items in the list, like this:

<ul>
<li>blah</li>
<li>blah</li>
<li>blah</li>
<li>...</li>
</ul>

Is there a way of counting the number of li items, splitting the list in two, and then displaying the content like this, in two divs:

<div>Col 1
<ul>
<li>blah</li>
<li>blah</li>
<li>blah</li>
<li>blah</li>
</ul>
</div>

<div>Col 2
<ul>
<li>blah</li>
<li>blah</li>
<li>blah</li>
</ul>
</div>

Frankly, I have no idea how to go about this. Thanks in advance if anyone can shed light for me...

 

You could just use CSS to split the list. Adjusting the width would let you get more columns in, and if the screen size shrinks it will automatically collapse back to a single column.

 

Thank you very much! Seems to be the simplest solution by far.

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.