Why is IE screwing up table width?

[xoggoth]

I was going to ask that. Actually, I started out never using tables, as seemed complicated, using absolute positioned divs with left% etc. and my product pages still do that.

But one sees loads of mainstream pages that rely heavily on tables, this CUK page for example, so bit puzzled by strictures against them. Never seen anything saying they are discouraged or likely to be obsolete.

While on webby stuff, a big problem in FF jscript is lack of the all object. Most grateful if anyone knows how to loop through all the divs on a page say in a way that will work in FF. Nice if those interactives http://www.gatekeeperel.co.uk/interactives.html would work in FF.

PS Yes I know one could do it in Flash but not everyone has it.

[PAH]

I was going to ask that. Actually, I started out never using tables, as seemed complicated, using absolute positioned divs with left% etc. and my product pages still do that.

But one sees loads of mainstream pages that rely heavily on tables, this CUK page for example, so bit puzzled by strictures against them. Never seen anything saying they are discouraged or likely to be obsolete.

While on webby stuff, a big problem in FF jscript is lack of the all object. Most grateful if anyone knows how to loop through all the divs on a page say in a way that will work in FF. Nice if those interactives http://www.gatekeeperel.co.uk/interactives.html would work in FF.

PS Yes I know one could do it in Flash but not everyone has it.

Flash would undoubtedly produce a much cleaner version.

Truth is there's nothing strictly wrong with tables, in their basic form. The old slice and dice photoshop image technique is what causes some to think tables are bad full stop.

I used to use absolute positioning but it causes yet more headaches, so tables with percentage based columns are my current favourite approach.

Don't do anything with javascript unless absolutely necessary so can't help there, sorry.

[Ardesco]

Tables were the way to do it before CSS2 I believe and some people haven't moved on (I'm sad to say my sites are still using tables for layouts at the moment, but both have planned updates that will move them fully over to CSS).


Forum packages like vBulletin store CSS data in a database and write the CSS into the top of every page. Because the CSS is completely customisable by the user it is easier to force the layout via tables to ensure that the basic structure of the forums is fixed and the CSS tweaks don't break everything (could you imagine the sheer number of support calls they would have if it was all controlled by the CSS)

[Ardesco]

Flash would undoubtedly produce a much cleaner version.

Flash has a place, it is on sites that companies decided to make because they thought the idea of a web presence was good but had no idea what to put on their site. These sites are not really supported and are never seen by the general populace so nobody cares that they are full of flash.



The only reason I can see to use flash is to make banners that have more than 256 colours (otherwise GIF would do).

Weren't they going to make an animated format based on PNG at some point, or something like that?

[NickFitz]

What is the acceptable standard compliant way to present the traditional 3 column layout (as originally inspired by newsprint formats) without using a table?

Take your pick of these: http://css-discuss.incutio.com/?page=ThreeColumnLayouts

I'd recommend one of the approaches based on negative margins: Ryan Brill's ALA article shows a technique that can easily be adapted for three columns, Thierry Koblenz has taken the idea a bit further, John Oxton explores the idea in great depth, and Andy Hume has a good, quick explanation at Bitesize Standards.

Edit: BTW, all of those sites are worth exploring in depth - not everything on them is perfect (it's been quite a steep learning curve over the last seven or eight years, and even the experts have in the past espoused techniques that they have since found to be wanting - even Eric Meyer used to be quite easygoing about using one table for the basic page layout, until people worked out how to do without it), but there's a lot of good stuff out there.

[NickFitz]

I was going to ask that. Actually, I started out never using tables, as seemed complicated, using absolute positioned divs with left% etc. and my product pages still do that.

But one sees loads of mainstream pages that rely heavily on tables, this CUK page for example, so bit puzzled by strictures against them. Never seen anything saying they are discouraged or likely to be obsolete.

While on webby stuff, a big problem in FF jscript is lack of the all object. Most grateful if anyone knows how to loop through all the divs on a page say in a way that will work in FF. Nice if those interactives http://www.gatekeeperel.co.uk/interactives.html would work in FF.

PS Yes I know one could do it in Flash but not everyone has it.

Table-based layouts are a nightmare for users of assistive technologies such as screen readers. Tables were intended to be used to display tabular data (for which they are still appropriate) such as a table of experiment results or a calendar , and the use of them for layout is a hack from the days when Netscape Navigator 3 was considered cutting-edge.

"document.all" was introduced in IE 4, but was replaced - even in later versions of IE by W3C DOM methods. If, for example, you want to get all <div>s, use

var allDivs = document.getElementsByTagName("div");

If you wanted to get all the list items in a list with the id "example", you could use

var items = document.getElementById("example").getElementsByTagName("li");

Or you can use one of the excellent JS libraries such as YUI or JQuery. In JQuery, the above two examples would be

var allTheDivs = $("div");

var items = $("#example li");

To set all the list items to have a green background, for example, you could use

$("#example li").each(function() {
   $(this).setStyle("backgroundColor", "green");
});

(although a better approach would be to set an appropriate className on the ul#example which caused a CSS rule in an external stylesheet to be applied).

[PAH]

Take your pick of these: http://css-discuss.incutio.com/?page=ThreeColumnLayouts

I'd recommend one of the approaches based on negative margins: Ryan Brill's ALA article shows a technique that can easily be adapted for three columns, Thierry Koblenz has taken the idea a bit further, John Oxton explores the idea in great depth, and Andy Hume has a good, quick explanation at Bitesize Standards.

Cheers, I may end up a bit more educated after all.

[PAH]

The only reason I can see to use flash is to make banners that have more than 256 colours (otherwise GIF would do).

I avoid flash like the plague too. Once had to modify a website based on a flash template. A right pain in the ass just to change a bit of wording, with all that timeline mumbo-jumbo.

Not sure I like the direction M$ is going with it's Silverlight stuff. On the surface it's an obvious flash type solution, but I can see them bloating it into all sorts of uses. So long as they leave their core dev tools alone. Sick of re-learning stuff every few years. At the end of the day unless they resort to plug-ins it always ends up as HTML, css, and javascript anyway. So why keep re-inventing the wheel?

[NickFitz]

Cheers, I may end up a bit more educated after all.

HTH - I like to get other people working with standards, just in case I ever get a gig where I have to maintain their code

[PAH]

HTH - I like to get other people working with standards, just in case I ever get a gig where I have to maintain their code

Wont' help with me. Even if I do inadvertantly code something that would pass scrutiny, I always roll it back to a mish-mash of incomprehensible code just prior to me leaving. I believe some call it obfuscation.