Some Advanced CSS Help

[fear2670]

I never thought I'd see myself posting here, never the less I need some CSS help on something pretty advanced.
I made a tutorial, it fully works in all browsers except IE(all the way to 8).

I would highly appreciate it if anyone tells me how to make it work in IE.
Read the tutorial introduction for more info on what I'm trying to achieve.

[jameson]

It looks exactly the same to me in IE7 and Firefox.. what are you seeing that's different?

[fear2670]

It looks exactly the same to me in IE7 and Firefox.. what are you seeing that's different?

It doesn't make a row properly in IE(all versions), the demo I have on the site works on all browsers only because all the rows are the same length, other than that you can see the bug, but since in tabular data the rows are mostly the same length the bug isn't much, but it's still annoying.

[jameson]

If you add a display:block to the #table li, does that help?

[fear2670]

If you add a display:block to the #table li, does that help?

<li> already is a block level element, that's why i put float left so that it would stay as block but go side by side until something breaks the float (in this case li.row which clears the left floated elements, thus creating a new row).

[Scriptage]

I'm not being funny but why would you possibly want to make a list look like a table? If you're displaying tabular data then use a table, if you're creating the layout use page divisions, if you're creating a list of items use ul and li.

[fear2670]

I'm not being funny but why would you possibly want to make a list look like a table? If you're displaying tabular data then use a table, if you're creating the layout use page divisions, if you're creating a list of items use ul and li.

Because I hate the <table> tag

[Scriptage]

---

ADVERTS - NOT VISIBLE TO MEMBERS

---

Essentially what you are doing by using lists in this way is making an accessible table inaccessible. When a screen reader sees your list it will just read each and every item on the list one after the other as a continual stream of audio, whereas, when a screen reader encounters a table it clearly identifies which data belongs to which column and clearly indicates the context.

Download Thunder and you will see what I mean.

It is right to hate the table tag when it is used incorrectly but it is in the HTML specification for a reason and should be used for its intended purpose.