Are tables as bad as they say?

I read that article that sabian1982 just wrote. I had a similiar experience myself actually: although I agree wholeheartedly with the ideals and the definite benefits behind using pure CSS layouts, I came to different conclusions.

My transition experience: I had actually made an endeavor for about 6 months last year to code all project layouts only in CSS, and to avoid tables at all costs (having read several books and articles on the subject over the course of the previous year, including scouring alistapart and CSS zengarden).

In a lot of situations, it was extremely beneficial and worthwhile to code my layouts solely using CSS, but in other situations I found myself pulling my hair out trying to implement/research hacks or workarounds to some pretty complex layouts. In one situation I found myself "retreating" and implementing a table-based layout simply to save production time, and in a few instances I maintained a CSS layout, but I had to implement tables within these layouts. In all of these problem situations the main issue was keeping the layout/appearance of the site consistent across all major browsers and platforms.

After 6 months of putting this into practice was when I came to pretty much the same conclusion that rightandtight came to: I need to hold onto tables as an option in situations where I can't 100% rely on CSS positioning in terms of cross-browser compatibility. Instead of having to find/implement hacks for considerably unique situations, I would ultimately save time.

Perhaps it is that I'm not experienced enough using CSS, but as a freelancer who gages his production time by the hour and isn't paid a salary, I have to consider what is best in my particular situation. So far, I have yet to come to the conclusion that I will save time creating complex layouts (as opposed to simply 3 column layouts, etc) using CSS alone. I would really like to be convinced otherwise, but I have to rely on my experience in unique situations.

 

I've found that using tables for things like 3+ column layouts to be a pain in CSS. It gets all crazy floating two divs, then absoluting a third, etc. I usually just use CSS to control table and cell properties when I have to use a table, that way a CSS controlled table is nearly as compact as the same div/CSS layout.

I think tables get such a bad rap because of the gross overuse of nesting and image spacers. Just because you elect to use a table somewhere, for layout purposes or otherwise, doesn't mean you can't still reap the benefits of CSS and semantic information structures.

 

Excellent point. There definitely is a solid difference between abuse of table elements vs. practical use of tables. It's all about finding the most practical solution (which is sometimes a combination of both) in my opinion as opposed to thinking strictly pure CSS layouts vs. table layouts.

 

Yeah there are a few situations where CSS is just plain awkward - things like 3 column layouts, or layouts with a proper "footer" are two examples of those situations! However, there are sites out there with "templates" for these sort of things that you can just take and use - examples are http://www.thenoodleincident.com/tutorials/box_lesson/boxes.html and http://www.glish.com/css/ (no affiliation with either of those sites)

Ah yeah but you are already messing around with the semantics by using tables for layout

But seriously though - people are talking about researching hacks and stuff a lot. You dont really need to know more than one or two "universal" hacks that you can use to give IE special instructions - the main one I use is the "* html" hack described here: http://www.mdibb.net/web/generic_cross-browser_css_hacks/

(sorry not enough posts yet or something to do real links )

 

Very useful, thanks!

 

the_pm pretty much covered the issues you addressed to me, but I'll throw in another couple of cents worth—maybe redundantly, maybe shedding new light.

Absolutely. CSS offers presentation power you could only wish for with tables. Further, html, as a subsection of sgml, has a rigorous grammar[1]. Using that grammar correctly (impossible in a nontrivial table layout) means a machine can translate it to other markup languages such as groff, LaTeX, xml, PDF, &c..

As to the time it takes to learn, I doubt it will take as long as it took to become proficient with tables. Remember those first complex layouts? I suspect you're expecting to be able to do equally complex stuff with css without the apprenticeship you went through with tables.

As professionals, we're expected to stay current with our technology; preferably a little ahead. My own program includes haunting forums like this one, looking for problems that expand my scope. These forums provide a wider variety of issues than I would normally meet in my own little world. Second, I try to take at least one college level course each year. So far, there's been Java programming, MySQL administration, Linux installation and administration, PHP programming and javascript programming. The Apache admin class I meant to take last Fall was canceled; I'll look for it again. None were new to me, but each took me deeper than I would have got on my own.

Close. I don't say there are no fixes. I say I have chosen not to use them. Plus, many of the pages are there to specifically deal with some (usually) IE issue. The index page, for example, is derived directly from a layout that works just fine in IE, but I removed the fix in order to emphasize that IE in particular is a crappy browser. Now look at the vertical centering pages. They all work cross browser, because the issue was to make something that's simple for modern compliant browsers doable in a PoS like IE.

It has been feasible for at least three, maybe four, years. The biggest impediment has been MSFT's poor documentation of its weird float model, its buggy positional model and that abomination, hasLayout. Fortunately, the community—especially John Gallant, Holly Bergevin, Ingo Chao, Bruno Fasino and Clair … Well, you get the idea—have ferreted out the causes and fixes.

By all means, if you hit a wall that sucks up too much non billable time, fall back to your comfort level. Just recognize that you're the one who failed, not css. Put the issue into your must learn box, and research the problem after work hours. (Professionalism raises its head again )

Believe me, once you're as good with css as you are with tables, you'll kiss table layouts goodbye and never think twice about it.

cheers,

gary

[1] A grammar is a collection of linguistic rules which define a language.

 

Ah, I guess I misunderstood your wording. I interpreted it as you saying there was no fix, not that you chose not to use one.

Anyway, who knows, maybe in time I will completely abandon tables. But for now, I'm keeping them in my back pocket.