CODEWITHSUNDEEP
htmlcss
caleb
caleb

Reputation: 1637

Aligning parallel ordered lists

I have two order lists with comparable information but list item contents may not have the same length. Due to wrapping, certain list items span different number of lines. 

List 1        List 2
1. xxx        1. xxxxxxxx
2. xxxxxxxx      xxx
   xxx        2. xxxxxxxx
3. xxxxxxxx      xxxxxxxx
   xxx           xxx
4. xxxx       3. xxxx
              4. xxxx

Is there a way such that equal item labels are horizontally aligned (without resorting to using tables)?

List 1        List 2
1. xxx        1. xxxxxxxx
                 xxx
2. xxxxxxxx   2. xxxxxxxx
   xxx           xxxxxxxx
                 xxx
3. xxxxxxxx   3. xxxx
   xxx
4. xxxx       4. xxxx

Upvotes: 1

Views: 962

Answers (1)

Jacob
Jacob

Reputation: 78850

CSS just isn't equipped for this, unless you're content with making each li a fixed height. Honestly, I think that if you're needing these aligned, your lists are related to each other, and really it is semantically a table.

Upvotes: 2

Related Questions