CSS UL as table with float left

Question

At some point my code is not working for multi lines table with ul. Everything is on link below.

http://jsfiddle.net/eagerwolf/GXxLn/

I added

width: 300px;

to parent element. In real this is limited with div... but never mind issue stays the same...

Does anyone have any idea about this problem?

Answer 1

You are using a cricket bat to play baseball

Use table for tabular layouts

Change your markup, use table, tr, td and not ul, ul are meant for listing items.

---

If anyways you want to use ul and li for creating a table layout, than you should use display: table; and display: table-cell; which changes the display of the elements, but still, you shouldn't do that, you will find hard to use display: table-row; and such properties as only li can be nested as a direct child to ul element.