Compatibility problems aligning tables

I can't make my two tables consistently stay in side-by-side columns

[DMitchA]

Hi,

I'm a newbie, and I've read a lot of the table notes but haven't found a source and solution yet for my problem.

My Web page uses a CSS and consists of two tables: a narrow left-side (locked at width=180) and a wider right-side. On my computer, and on most people's computers who contact me, they appear consistently side-by-side, in a left and right column.

Now I'm getting feedback from people with very wide screens (18") and no sidebars open that my right table opens up on the right-side, then jumps down to the bottom, underneath the left, after the page fully opens. I'm baffled! I don't know if this is a Mac incompatibility (I'm using a PC), a browser issue (one person uses NN6+, as do I, but his messes up and mine doesn't), or what.

I can't seem to recreate this problem in my browsers, so I'm at a loss!

I have a PC and use Netscape 6.2.2 and IE 6.0.2800.1106IS. The Web page is <sorry, no URLs>

Thanks so much! dma

[edited by: tedster at 10:02 pm (utc) on Mar. 31, 2003]

[g1smd]

Whenever I have had this problem I have simply nested each table inside the table cell of a bigger table, with one row and two cells in it; a table inside each.

[tedster]

You may be able to recreate and test for this kind of thing. The issue is screen resolution, not the physical size of the monitor.

It depends on what your equipment supports, but the place to look is here:

Start > Settings > Control Panel > Display

...and then click on the Settings tab. You should see a small slider in an area marked "screen area" or "screen resolution". If you can move it to the right, you'll be able to render more on your own screen and test for this kind of problem.

That being said, g1smd has a good solution for you.

[DMitchA]

I think the extra nesting is probably the perfect solution. I'm going to do the recreation first to see if this was fixed when I reduced image size. If not, then I'm going to go with the master table.

THANK YOU!

[g1smd]

Run the code through [validator.w3.org...] as well, as it is soooo easy to drop a tag in the wrong place and mess everything up.

[DMitchA]

I wanted to validate but wasn't sure how to identify the DOCTYPE in my page so the validator will read it. I don't know what HTML level I'm writing at.

NEEEEEEEWBIE... Thanks -- dma

[g1smd]

Unless you are using an extremely limited subset of tags (HTML 3.2) or cutting edge coding (XHTML 1.0) then you will probably find that HTML 4.01 Transitional selected from the drop-down box will be just fine.

When you get the results screen up, you will see that it has inserted the correct !DOCTYPE code into your page listing on the very first line. You will need to cut and paste that code back into your page source, changing the lower case html back to uppercase HTML.

It will also ask for a character encoding and I expect that ISO 8859-1 will also be fine for you.

[DMitchA]

Wow--thanks, Ted. I did just that, but I got a ton of the same error. The note consistently is that an attribute is undefined. But all of the definitions are in the CSS, not the page itself. Do you know if it's possible to direct the parse back to the style sheet so it will see the definitions it says are missing?

The basic info on "4.01 Transitional" and the encoding were helpful, too. The validator says it's not a valid format for transitional or any of the other ones, but that seems to be because it's not recognizing the style sheet. dma

[tedster]

The error does not refer back to your CSS - it's got something to do with the code in your HTML document - that is, with the tags in your HTML. For instance, an <img> tag is required to have the attribute alt="", even if there is nothing in between the quotes.

So look at the line reference for each error and see what tag the validator is making the comment about.

[DMitchA]

The errors aren't formatting errors; I believe they're stating they're code errors. As in, such an attribute does not exist in the language. Maybe I'm misunderstanding their text. But the codes they flagged definitely work and are making my page look correct. Here are some samples --

* Line 21, column 11: there is no attribute "LINK" (explain...).
* Line 21, column 27: there is no attribute "VLINK" (explain...).
* Line 21, column 43: there is no attribute "ALINK" (explain...).

<BODY LINK="#000000" VLINK="#c5bcc2" ALINK="#c5bcc2">

That goes on for every attribute, "color" doesn't exist for headings, "bgcolor" doesn't exist tables. The site's explanations suggests this code might be proprietary to the software I'm using, but this is just basic html I hand-coded.

If you don't have time to go into this; I understand. The page works now with the picture fix, and this might ultimately be moot. Thanks very much either way! dma

[BlobFisk]

Hi DMitchA,

The validator errors that you outlined above are referring to deprecated tags. These are tags that are no longer part of the html4.01 standard. However, current browsers will still render them, which is why your pages still look ok. The chances are, though, that future browsers (which will hopefully be 100% standards compliant!) will not render them at all.

There is a discussion here [webmasterworld.com] on deprecated tags, as well as an invaluable list of the deprecated tags.

[DMitchA]

Aha!

Thank you thank you thank you. I will make this my next project, to upgrade the language of my site. Looking forward to learning more at the redirect you offered. dma