asked on

Trying to put a tabel in a division

I am trying to put a table inside a division, the table has 3 cols
col1 and col3 being 100px with the remaining wider center column in the center.
The style for the table was fine until i put into this division.
I am trying to make it look like attachment. After attempting to adjust the floats it is no longer in the division and the table has lost their widths
How can i fix this:

http://roofgenius.com/test3.asp
Books.jpg

isnoend2001

ASKER

I have manage to get the table inside the division red border, but the table cells are not the correct size

ASKER CERTIFIED SOLUTION

skullnobrains

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

SOLUTION

Chris Stanyon

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

isnoend2001

ASKER

Thanks
I tried floating them left and right and it did not work. I was probably doing something wrong.
I used absolute positioning

skullnobrains

this is normal : floating stuff left and right at the same time just does not work or at least does not in a cross-browser fashion. the only simple way that does work cross-browser when it comes to left+right positioning inside an element that has no specific size or position is to combine float:left for the inner left element and text-align:right for the parent element, but it is uselessly complicated in this case.

Chris Stanyon

floating stuff left and right at the same time just does not work

really! first I've heard of it ;)

skullnobrains

sorry, the comment was a bit harsh. no hard feelings on my side.

they actualy do not in some browsers (guess which) : one of the float will end up below the other one like this

|                                      float right stuff |
|                                            second line |
|float left stuff                                         |
|                                                               |

Open in new window

even if you play as much as you can with clear and make sure the width are small enough and they do not overlap

i pretty much agree the corresponding browser implementations are weird at best

correcting with position:absolute works as far as i remember but messes up some other browsers since the float gets ignored.

isnoend2001

ASKER

Got it to work with absolute positioning
Had to add this to container:
position: relative;

http://roofgenius.com/test3.asp

skullnobrains

nice and clean ! and i did not even know this would work using an absolutely positionned table (my suggestion actually implied using divs)

thanks a lot for posting back

best regards