Warning: I’m not a CSS guru, but I’m working hard at doing the right thing with a current project. If you take the time to read through and look at what I’ve done I think you’ll agree. I have run this layout through the W3C validator for the past week and killed over 60 identified errors.

I’m working on a page layout wherein I’m trying to have a typical 3 column layout, right and left columns for little sponsorship or announcement bits and the center for the main content of the site pages.

I borrowed a layout template from here:
http://webhost.bridgew.edu/etribou/layouts/skidoo/lean/index.html

I’ve got it working for the most part with one very annoying exception, the center content aligns it’s topmost elements below the last element of the left column, rather than at the top of the center column.

One of my constraints is that I’m developing this site with an application development plaform called Application Express by Oracle. It’s a very table dependent rendering engine, however I’m bucking that trend and trying to develop this page using as few tables as possible. You can verify this with FF web developer toolbar by outlining the tables/cells vs. block elements.

You can see my work-in-process here.

http://www.utoug.org/pls/apex/f?p=970:1

You’ll need to scroll down the page to see what I mean about the vertical alignment problem.

If you go to this page http://www.utoug.org/pls/apex/f?p=970:3 you’ll see that the heading of this center column will come up to the top. But, if I put any amount of content in the center column besides that basic heading it shoves everything down below the left column content.

Does anyone have any tricks or advice for me to troubleshoot this problem? I’ve been working on it for a couple days and not getting very far.

P.S. I cannot entirely eliminate the tables that are being inserted into the HTML. This is part of the rendering engine that I cannot control.

Thanks for any help you might be able to offer.

Earl