Topic: What's wrong with my tables??

The site I'm working on ( www.kussatz.com/erik ) uses a table with 5 columns to align everything. Cols 2, 3 and 4 contain the contents, the other two should make them appear in the center of the page. Just have a look at it with IE and you'll know how it should look like .

But Netscape and Opera don't seem to understand this layout at all ... the whole browser windows is filled up with the three cols that *should* appear in the center while the left and right one have a width of about 5px!!

Any idea how to fix this?
I guess I'll go crazy soon - at least, I'm in the right place here...


Tilo

PS: A Merry Christmas To You All!



[This message has been edited by kuckus (edited 12-25-2001).]

Here your first problem:

<td class="borderarea1">

<img src="pixel.gif" width="1" height="40" border="0" alt="">

You should have a width attrribute in the TD tag and the IMG tag should have a matching width, which, preferably, should be the real width of pixel.gif.

Basically the same thing with:

<td width="30" class="borderarea2">

&amp;nbsp;

</td>

<td class="borderarea1">

&amp;nbsp;

</td>

Notice that the top TD in the above has a width attribute, while the second one doesn't. Since the second one doesn't have width specified, it's going to get minimum width, which isn't much for  .

I'm pretty sure that's it. Make sense?





[This message has been edited by warjournal (edited 12-24-2001).]

Well, yes, the two TDs don't have width attributes because I want their width to depend on the size of the browser window. The three middle columns have a fixed width and the other two should take up the remaining space. I tried to use something like width="50%" on both of them, but it doesn't work that way. In IE everything's fine without these width attributes, though.

Maybe some kind of Javascript could resize a transparent gif in these TDs... I'll have to try this.

But it can't be impossible without Javascript since IE manages it, huh?

[This message has been edited by kuckus (edited 12-24-2001).]

If the rest are fixed, then width="100%" in those TD tags should do it.

If you want a 3 column layout, centered, just do your 3 column table and enclose it in <div align=center></div> strip out the outside 2 columns

That should do it. Say if it doesn't then we can look insude your markup, not something I wanna do on Christmas eve I got toys to assemble. What about you wj? Monsters need toys too =) Merry Christmas to you and yours.

Jason

Actually, there are a lot of things like that that I don't worry about. Most of that Christmas stuff falls on the women around here. My job is to put my foot down when the monsters get a bit unruly. Three little girls, and a little boy -- with two more total on the way, so next year will be a real killer. Right now I've got some of a closet tore out so I can get to the plumbing, and that little crawl space is The Chokey. When the monsters get out of hand, I show them Them Chokey and threaten to put them in there. After that, they straighten up for a few hours.

Yeah, I'm the bad guy. It's tough being me sometimes. :sigh:

Now everything looks fine in Opera, too. I added the three width attributes to all rows, that seems to help Opera. But it still doesn?t work in Netscape.

warjournal: The 100% each method doesn?t work either, all three browsers make the first column as wide as possible and don?t give any space to the last one.

JKMabry: wouldn?t be a bad solution. But I don?t think that?s too easy to manage since I don?t want to loose those dark borders on the top and bottom of the page, is it?

Updated page, same URL: www.kussatz.com/erik

Tilo

Wow, that's crazy! I went through the code adding "..."s (what's their name ... quotation marks, I guess), changing all tags to lowercase and trying to make it look a little more pretty. Afterwards, I had a look at it in Netscape and everything looked exactly like in IE and Opera - amazing, very amazing! I guess Netscape just doesn't want to display anything that isn't written in a very clean way. Though I really can't figure out in which way the page now differs from the 'original' one. But I'm happy now

One last thing I'd like to understand: Why draws this funny Netscape thing right and bottom borders bolder than top and left ones? Doesn't make any sense to me, I used "border: 1pt solid #aaa;" everywhere - any idea?

Tilo

When you refer to "Netscape" which version are you talking about? 4.7 has wretched support for CSS and doesn't support colored table borders really either, that's always been an IE 'extra'. NS6(.2) may have implemented it like they did IE's a:hover, don't have any NN browsers in fron of me at the moment.

What you asked about keeping your strip on the top and bottom could be accomplished by nesting your 3 column table inside a 100% width table, then you could use the mother table to set the alignment attributes for the main 3 col inside. Sounds like you got it fixed though.

Surely the whole thing could be done with DIVs and CSS also but I'm sure you don't wanna go there just yet as you've just worked out your table bugs =)

Jason

I was running Netscape 6.01. But in Netscape 6.2 everything seems OK. And if someone doesn't like the way his older NN displays some borders, well, why doesn't he use IE? I think it's been enough Netscape tuning for now.

Thanks for helping!

Tilo

That's one bright site!

Just a word of caution. In NN4.7 there are borders around the entire document. You may want to add in the body tag margin-right="0" margin-left="0" margin-top="0" margin-bottom="0". This way the document will span the entire window.

NN4.7 doesn't know what the CSS margin:0px means.

Later,
C:\

Thanks for your tip, CPromt! I fixed that one (though I used marginwidth="0" and marginheight="0" instead to make it work), but I'm nor really sure how to fix all the other things NN 4.7 doesn't understand (where has the texterea gone?) ...

Is there anyone around who knows what NN wants to hear to make things look a little more like in NN 6 or other newer browsers (i.e. the table thing I just managed in NN 6 and Opera 5)? Cause I'm a little confused

Tilo

kuckus: I'm glad to see you've got you column problems sorted out but I suspect the question should now be do you want it to look the same in NS4.x as it does in more up-to-date browsers? I just think throwing 2 of the '4 Horsemen' into the mix at this stage, just for NS4.x (what about the other 2 for older versions of IE?), seems a bit of a backwards step and one that should only be done if that is really what you are aiming at.

That is an awful lot of yellow there but it has been done very nicely. I find myself slipping into 'review mode' and I'm trying to stop myself but having a Flash navigation panel seems a very bad idea indeed (no matter how well done!!).

Emps


You're my wife now Dave