|
Posted by richardv2 on 01/21/06 08:03
I've set up a three-column tableless site at www.eBookOptions.com. (You
can go there to see what it looks like if you wish.)
Mostly they work as expected except for two things.
My questions... (CSS Code for both below.)
1. Why do I need different "top"s? (leftmenu=135, content=10,
right=135) The tops of these all seem to be 135 pixels from the top of
the page, but I must use "top: 10px;" for the center content column to
work.
2. Left and right stay the same size, and the middle "stretches"
perfectly in all resolutions, EXCEPT there is about a 10px gutter
between the columns. I've tried different numbers and can't get all
three columns to "just touch". What am I doing wrong????
(Comment: I used 1px red, green and blue borders to make it easy to see
and edit. Later I will drop the left and right borders.)
#leftmenu{
border: 1px solid #F00;
padding: 5px;
top: 135px;
position: absolute;
width: 100px;left: 0px;
margin-left: 0px;
margin-right: auto;}
#content{
border: 1px solid #0F0;
padding: 5px;
top: 10px;
position: relative;
margin: 125px 155px 0px 100px;
width: auto;}
#right {
border: 1px solid #00F;
padding: 5px;
top: 135px;
position: absolute;
width: 155px;
right: 0px;
margin-right: 0px;}
Navigation:
[Reply to this message]
|