Table Layout Vs. Css Layout So using tables is considered bad style?

	Table Layout Vs. Css Layout - So using tables is considered bad style?
	Discussion by eyvind with 18 Replies. Last Update: May 13, 2005, 11:23 pm (View Latest)	Page 1 of 2 pages.

eyvind

I have heard that using tables for layout in a webpage is bad style. It is possible, but much more of a hassle, to get the same results using CSS (float), but is using float in this way really better style than tables? Most websitesstill use tables.

Please give me your opinion, or the "general" opinion uif you think you know it, I'm curious, and can't decide which way yo go.

Mon Apr 25, 2005 Reply New Discussion

signatureimage

Yes, you are right.
Using HTML TABLEs for lay-out is now considered bad style.

Yes, you are right.
Getting the same results using CSS is much more of a hassle.
At least when confronted with it for the first time.

But, as always,
as more and more people do it,
as more and more programs generate it,
the use of HTML TABLEs will drop for lay-out and
will continue to be used for what they were invented for:
the presentation of tabular data.

In my opinion, CSS is the way to go.

Personally, I still have troubles with them,
so any help that I can find is welcome...

Mon Apr 25, 2005 Reply New Discussion

moonwitch

Well, I have to admit that I did use tables to generate my lay out. Mainly because it was the first time using tables to put a graphic up

I do realize that CSS can get the same result and I am looking into it. But I am also working on redoing my site and converting it to php, which is trickier than I had anticipated. So when you find how exactly to do this in CSS, let us know

I do want to add, that not all broswers support all CSS2 features (IE is the browser I am reffering to of course). This is the case with the a:hover effects in a nested list for example. (To create pop out effects like the ones you get with JavaScript, but then without JavaScript)

Tue Apr 26, 2005 Reply New Discussion

eyvind

I already know how to do it in CSS, I was only wondering if it was teh way to go or not.

This might not be the best way to do it, but I see no other way.

To get a layout like this (the different numbers designate what would be cells in a table):

00000000000000000000
00000000000000000000
11122222222222222222
11122222222222222222
11122222222222222222
11122222222222222222
11133333333333333333
11133333333333333333
44444444444444444444
44444444444444444444

These are th divs you will need (DIV1, DIV2, etca re just names for referencign here, you don't need to use those names of course):

DIV1 -- for the top, no nesting, no positining
DIV2 -- will contain areas 1, 2, and 3, no positioning
DIV3 -- for area 1, nested in DIV2, float left
DIV4 -- will contain areas 2 and 3, nested in DIV2, float right
DIV5 -- for area 2, nested in DIV4, no positioning
DIV6 -- for area 3, nested in DIV4, no positioning
DIV7 -- for area 4, no nesting, no positioning

no positioning means no special horizontal positioning, you may need to have some settigns that will keep them from moving around vertically.

Hope that helped!

Tue Apr 26, 2005 Reply New Discussion

Coach

QUOTE (eyvind)

[post="30659"]<{POST_SNAPBACK}>[/post]

I found an article that talks about the tables vs. CSS dilemma, it describes briefly the evolution of the website design in the last time and, most interesting, the author explains the experiment he made to find out which option outcome better:
http://www.sitepoint.com/article/tables-vs-css

I hope it can help you clarify which way is better for you.

Tue Apr 26, 2005 Reply New Discussion

eyvind

Cool, thanx Coach! That did help, I have now set my mind to using CSS.

I ahve alsready tried the above solution, adn it works well, but I need to handl some special cases, which I do in PHP. IT works great! But that article jsut amde things so much better, tahnx again Coach!!!

Tue Apr 26, 2005 Reply New Discussion

twitch

You are right, but I can not stand floating layers with CSS. They always manage to go wrong. And what exactly are the problems with using tables? I have only found small errors when using the box-model, of which I don't use. I think it is just another reason for the W3 to bossing us around. Well no more I say.

Wed Apr 27, 2005 Reply New Discussion

mimi_m

QUOTE (twitch)

[post="31000"]<{POST_SNAPBACK}>[/post]

I totally agree. I've used both CSS and tables to create site structure, and not only does it take me 50% less time to make a site with tables, but also, i find that tables don't generate nearly as much errors as floating layers with CSS does.

I've worked with websites for quite some time now, and it's true that either way works, but I don't see any advantages of using CSS instead of simple tables. I guess it depends on how comfortable people are with either one. Personally, I've never had problems when using tables, but always seem to get at least some sort of error or problem when structuring with CSS.

So naturally, tables is what i choose to use. That's my opinion.

Thu Apr 28, 2005 Reply New Discussion

dungsport

So, It is apparently that using tabled-layout is easier. I usually use CSS for fancy things like theme styles... In this case, CSS does much better and much more flexible.

In my opinion, for the basic web page structure, tables are more likely compatible with all existing browser. I found my pages are displayed differently from one browser to the other when I use CSS style (positioning, margin,...).

Some CSS attributes work in this browser but the others.

Have you ever tried to view your web pages in several browsers? Do it and see how good your design skill is. Let's consider M$ Internet Explorer, FireFox, Netscape, Opera, Linux browsers (Konkeror, FireFox, Netscape...)... and even Safari on Mac.

I have been struggling with my project just because of these browsers. People in my company are using different platforms and different browsers. LOL, each of them complains to me about my pages very very differently. What a shame!!!

The more complex is your page, the more likely that compatibility problems will arise

Keep it simple as long as it works for everyone (even though it is not a good style)

Thu Apr 28, 2005 Reply New Discussion

chiiyo

Reading through the comments of the link that Coach posted is another very interesting link on this subject, where the author attempts to take an objective look at tables and CSS, this time, advocating that tables should be used side by side with CSS. It's an interesting read, at least, and gives some form of hope to people still wanting to use tables...

Thu Apr 28, 2005 Reply New Discussion

zorlen

Hmm, I never considered using CSS only for layout before. I am definately going to have to try that out. If you haven't guessed, I'm one of the table users, but this CSS solution has intruiged me. I'll probably start experimenting once I update my website a few times.

Mon May 2, 2005 Reply New Discussion

rkosh

I use tables for the initial positioning of the page, but the div layers inside of those tables for the smaller elements. The problem with div layers right now is IE's rendering of values that can throw off how they really should be aligned. Padding is my biggest issue with IE right now.

Sun May 8, 2005 Reply New Discussion

m3ch4

Reading this article (and having barely started on my own page as of yet

) I'm curious about the author's use of "blank.gif" within some of his cells and his mention of it in the beggining of this article and in the use of his "box".

What exactely does that image do and what is it's purpose?

Wed May 11, 2005 Reply New Discussion

eyvind

It is aspacer, it adds transparent space (it's invisible), to pad and precisely position elements. SPacers are used on many image intensive (especailyl table based) websites, usualy name spacer.gif or something like that, it is just that, a spacer.

One thinga bout CSS compatablity. To use CSS effectively now during the browser war (which I think is dying off), you need some scripting to back your CSS up: you check to see what browser and OS the surfer is using and you fine tune your CSS style according to that, you may have separate ones or you change one "dynamic" one. MAybe in JavaScript, that way you would sidestep all compatability issues, granted, it would take a while and be quite tedious to set the system up, especialy to make it reusable.

Thu May 12, 2005 Reply New Discussion

sirknight

In my opinion, using tables still the best way to manage your'e web page design..It's also make use of cross-browser..so you are not to worry what type of browsers you're client will use.But actually, this forum gives me a hint that i can also create a site more on CSS, that i will try soon.

Thu May 12, 2005 Reply New Discussion