display:table versus using tables

Question

I was wondering if it\'s a good idea to use CSS display property to emulate tables for a veeeery simple forum system.

I know this wasn\'t good thing to do like 2 yea

Answer 1

display: table is great for situations where you want a grid-like layout, but for non-tabular data. It's supported since IE8, so you can definitely use it. If all browsers supported the CSS grid proposal, then I'd say display: table has basically no use, but support is not very good.

Personally, I think a forum is a great example of a grid-like layout for non-tabular data. But, I've gotten into arguments on StackOverflow in the past about what exactly "tabular data" is; I err on the very strict side of "table 1: numbers and figures," whereas others seem to lean toward saying that tabular is synonymous with "arranged in a grid."

Answer 2

If the information being displayed on the forum is tabular, then don't be afraid to use a table if it makes sense semantically.

For general page layout, personally I wouldn't use it. I'd stick to the typical block-level div layouts and floats. IE7 does not support display:table and there are other caveats, such as the fact that it will expand in width based on content. For the future, I look forward to when flexbox is fully supported.

I do occasionally use display:inline-block for centering dynamic list items and the like.

Answer 3

I think in the end of you are displaying tabular data, then a table is perfectly sufficient. I believe that when you use tables to control layout from a design perspective that purists will have a hard time because from a theoretical point of view, your semantic markup will be saying tabular data, but in reality you might be using it to position images. That being said, I have gotten frustrated at times trying to lay things out without using tables-- I know it's frowned upon, but who's perfect??

Answer 4

From personal experience display:table etc is pretty redundant ( Someone correct me if I'm wrong )

You are best of using div's and styling them with CSS accordingly.

Edit: ^ Without the use of display:table/display:table-cell.. And using more common/standard methods of displaying your data. ( However one could argue that it is a common/standard method )

Answer 5

I also agree with Phil, tables are for tabular data. I prefer using divs and spans than using tables wherever possible.

But if your data is tabular such as a grid, you may go with table.

Same tabular grid can be developed with just divs as well.

Answer 6

Most newer browsers are probably ok with it now. Best thing you can do is test it on the browsers you care about. You won't ever be able to make "all browsers" happy, no matter what you do.

I still use tables to structure my page in a lot of cases. Folks are right when they say you should use css for that instead, but good grief, the amount of work you have to put in to get divs to act like a grid properly in just one browser, let alone all of the major browsers, is still prohibitive. Unless you can find a real (as opposed to theoretical / philosophical kind of) problem with the table, it's just a lot more practical at this point.

Maybe when the css grid layouts become a suitable replacement, I'll repent from my evil <table> ways, but until then...