3 Column Layout

[Telos]

I'm trying to get a three column layout going for a page I'm writing in ASP.NET.

However I can't seem to get things to line up properly. The main div isn't lining up with the left or right column div, so there is a small gap between the columns.

Also for some reason it won't line up across the top when I use the same height for all three (except in Firefox.) I tried a hack for IE but it seemed to have no effect on the middle column's top position at all.

I assume that some of this is browser specific issues, but I can't get it to work with any single browser right now...

So clues on what's wrong?

.left
{ 
position:absolute; 
border:solid 1px;
top:50px;
left:0px;
width:150px;
}
.right
{
position:absolute; 
top:50px;
right:0px;
width:120px;
}
.main 
{
margin-top:50px;
margin-left:149px;
margin-right:119px;
min-height:300px;
background-color:#FFFFF0;
border-style:Solid;
border-width:1px;
}

[Telos]

Anyone?

[Sekka]

[#*$!.com...]

[Sekka]

Ok, this website bans that address.

Any hoo, try this,

[sekka.co.uk...]

[Telos]

Ok, much better. Except in Opera. For some reason in Opera the right sidebar appears below the center and to the left...

Also in all three browsers the left column overlaps the center slightly, I can probably fiddle it into place... but I'm curious as to why it wouldn't work as the article demonstrates?

EDIT: D'OH! I just noticed, when resizing the window in IE6 the left frame jumps left immediately, cutting off some of the text in the column. Then it moves around whenever you continue to resize... moving left if you make the window larger, and right if you make it smaller.

[Telos]

Bumping again...

[doodlebee]

Y'know - just sayin' - the day before you posted the original question, I had just put up a sample of code that does a 3 column layout with a "sticky" footer.

[webmasterworld.com ]

I remember seeing your initial post, and it was only a few lines up from this one.

Just sayin' :)

[Telos]

Maybe if you'd titled it "3 column layout w/ sticky footer" or something. I wasn't looking for any kind of footer, so I didn't pay attention to it. :P

(Sorry, I know I should have read the subtitle... but they're so tiny and my resolution is so high!)