# Away with tables.



## Da_iMac_Daddy (Apr 3, 2003)

Ok tables are really starting to bother me. I mean with the way they format text by the amount of text there is or the size of the table. Not cool. 

OK I am fairly knowledgable in CSS and have heard people saying they don't use tables anymore. So please enlighten me. How can I get rid of these stupid tables.

http://www.dekster.com/party/index2.html


----------



## Darkshadow (Apr 3, 2003)

Have to use absolute positioning with CSS.  You tell it exactly where to put the elements.

Bad thing about that is not all browsers handle CSS perfectly.  And a few don't support CSS at all - somebody using one of those older browsers that went to your site wouldn't see it correctly.


----------



## lurk (Apr 3, 2003)

Why does he need absolute positioning that is evil pure and simple.  Here is a good site for figuring out how to do the column like layout you are looking for.

http://glish.com/css/home.asp

And remember that absolute anything and sizes in pixels are evil...

Evil I say!!!

...evil...


----------



## phatcactus (Apr 3, 2003)

I have never heard this theory of absolutes and pixels being evil.  Care to explain?


----------



## Darkshadow (Apr 4, 2003)

Err...lurk...most of those tutorials use absolute positioning and sizes in pixels


----------



## lurk (Apr 4, 2003)

OK to be honest I just grabbed that as the fist link Google served up I did not look at the source close.  My bad for that.  I guess I should be a bit more specific on my point there...

First the problem with pixels.  They are not resolution independent but your audience is.  The assumption that everyone will be viewing your page at 800x600 or whatever is silly and unnecessary.  If a page is specified in resolution independent units it will scale better across resolutions and better survive user overides (I really dig the bigger/smaller font buttons on Safari).  

Just as an example on that ...evil... pixel based link I mentioned above if I change to 1920x1440 and then increase the font size to be legible the formatting breaks.  It is all smashed together and it even spills out of the CSS boxes.  However, if the sizes had been specified in resolution independent terms it would have scaled much better.  For instance had the side bars  been specified in units of em's or ex's then they would have scaled with the fonts.  The page would have basically rendered the same at the default resolution as well as at high resolution. 

Absolutes are evil for similar reasons as pixels they lock your presentation to a given rendering size.  For instance using my bad example site again if I maximazed that window on that 30 inch LCD that was rumored to be in the works I would have two little strips down each side of the screen with a huge middle field.  Now that might be what one would want but my gut feeling is that one would really want to maintain the proportions of the layout more often than not.  


Now I know that there are issues with different browsers not always rendering thing correctly due to their various bugs.  So to be pragmatic you will have to do whatever you have to do.  Me, I don't have to be pragmatic so this is just one of the windmills I keep tilting against.  

Just to combat the net kook aura that I may be giving myself here just let me point out that from the beginning html was intended to be  resolution and presentation independent.  Then people wanted to do more with html than the initial idea allowed for and a lot of hacks were introduced (can you say single pixel transparent gifs?) to get the results people wanted.  

Now with (x)html + css we have the tools to go back to a model of separating content from presentation and to make that presentation independent of how it is rendered.  As to why that is a good thing I guess that that is a religious principal of sorts.  The only support that  I can give for it is that information, text, data and whatever tends to lose its value when it is too tightly bound to its presentation; to reuse that data else where you need to extract it from the presentation which raises the costs associated with using it.  Now I am probably at an extream here in that my most important stuff is always in plain old ascii text - in that form I have the most power to manipulate it.  I don't brouse it that way though I use a simple html translation with a clean style sheet to give it a nice presentation.  The important thing is that I view the data through the filter of its presentation but I do not intermingle it.

Did that make sense I think it got a bit longer than I indended.  

-Eric


----------



## toast (Apr 4, 2003)

CSS are meant to relace <tables> in the future. Browers are now developing in order to be fully CSS compliant.

CSS2 let you qork with element a bit like DTP applications let you: absolute positions are available from the CSS code. You can hence order element X to be at y from left position, y being a pixel value.

The best thing you can do is to check the W3C or to read a bit of Zeldman, or also A List Apart. Those people know everything about CSS, W3C and all the such.


----------



## agusgriego (Apr 4, 2003)

Am I mistaken or XML with XSLT is the best way to separate content from presentation.

Other thing... Those who are design oriented: do you think content CAN be separated from presentation at all? You would  have to think of all types of contents you have, and generate a "rule" for each one of them..

Is that the purpose of content generating standards like SCORM?


----------



## goynang (Apr 4, 2003)

CSS is way to go dude!

I had been using CSS for ages for simpler stuff like font styles, background colours and so on but have finally taken the plunge into poistional stuff now.

With careful planning it's possible to vastly reduce your code size leading to quicker page loads, reduced bandwidth requirements, and easier source editing.

It's even easier to get cross-browser compatability (in some ways) and stuff like acccessability issues become much easier to sort out.

It's all good!

I still use tables, but now mainly for their real purpose - to represent tabular data.

I never, never, never nest tables anymore (unless I really have to!).


Some links for you....

http://www.tantek.com/CSS/Examples/boxmodelhack.html

http://www.webmasterworld.com/forum83/204.htm

http://webhost.bridgew.edu/etribou/layouts/

http://www.bluerobot.com/web/layouts/

http://www.projectseven.com/whims/cssp_3box/3boxnoscript.htm

http://www.zeldman.com

http://www.alistapart.com


----------



## phatcactus (Apr 4, 2003)

Hm.  I see your logic, but I still think pixel values and absolute positioning have their uses.  Sometimes I only want the contents of a page to stretch across 600 pixels or so.  Sometimes I absolutely want something at 10,10.

Personally, my own page is valid XHTML and CSS, but if I'm doing something that more than one person is gunna see, or i'm getting paid, I use tables.  No sense in using more advanced layout methods if they look like garbage to most people.


----------



## TommyWillB (Apr 13, 2003)

> _Originally posted by lurk _
> *Why does he need absolute positioning that is evil pure and simple.  Here is a good site for figuring out how to do the column like layout you are looking for.
> 
> http://glish.com/css/home.asp
> ...


I think I agree... Why swap hard coded pixel set tables for absolute positioning?

I think what you are really looking for is a way to make pages streachy and web-like... You CAN do that with tables if you use care and work in %'s...


----------



## toast (Apr 14, 2003)

It is obvious CSS are coming to replace tables. But for the moment, both have their use. One day (and that may be soon), CSS code will replace <tables>. Just wait for their code to develop a bit.


----------



## Darkshadow (Apr 14, 2003)

The code is great and flexible already...what you have to wait for is all browsers to actually use it correctly...


----------



## toast (Apr 14, 2003)

.. and when this will finally arrive, you'll be able to build your code with same precision as a QuarkXPress spreadsheet.


----------



## TommyWillB (Apr 14, 2003)

This is the thing that drives me the most nuts!

Quark is a page layout tool... Think about it "page"=paper...

The Web is NOT paper. Pixel level control is just stupid. It is contrary to the medium.

This is why I dislike sites designed by folks who use Quark, etc... They don't understand the medium and can't design for it.


----------



## toast (Apr 15, 2003)

Find me a site designed in Quark.
Not even Quark.com is.

Some sits may be designed with Freeway, but you'll find out that the designer has also tweaked the code after with any conventional editor.


----------



## TommyWillB (Apr 15, 2003)

I don't mean "built" using Quark...

I mean the graphic designer used Quark to make the UI designs that they then handed to the HTML guys to build...


----------



## toast (Apr 16, 2003)

One fact is, the Web is standardizing. Not only in code, but in appearance. Have you noticed how sites organize themselves in columns, a lot more than they did before ?

A sacred thing when you work for a magazine are "entries for lecture", things such as captions, paragrah titles, etc. The Web needs those too. He also needs codes about color, interactivity etc.

I don't know what to think about abs. positioning. I'll wait and see what it gives.


----------



## isaac_ho (Apr 16, 2003)

Hi Da_iMac_Daddy,

I'm happy that you want using CSS for web page's layout. I have written a page have a similar layout of your page but using CSS. Please view it at:
http://www.anywhere.com.hk/sample/20030416_party.html

I hope it can help you a little bit.

If you want to learn more about CSS, these web sites may help you:
http://www.meyerweb.com
http://www.alistapart.com
http://builder.cnet.com/webbuilding/0-7258.html?tag=dir

I also encourage you to learn more about web standards, the sites below may help you:
http://www.webstandards.org
http://www.w3c.org


----------

