Table conversion to CSS

[Joshua Beall]

Hi All,

I have a survey that is laid out with tables, and I would like to convert it
to a CSS layout. My first attempt is a dismal failure. Here is a mockup of
the original:

http://joshuabeall.com/pages/misc/survey.php

And here is what I tried to do with CSS (the different colors borders are
just so I can see what sections are where):

http://joshuabeall.com/pages/misc/csssurvey.php

Now, I have two specific questions, but if you see something with my code
that I don't mention, by all means tell me about it.

1) How do I get the text to be laid out as they are in two adjacent table
cells? I.e., so that it does not the text does not wrap below the "options"
box. (It appears to not wrap in IE, but does wrap in Mozilla 1.5. Although
in IE, even though it doesn't wrap, the "True/False" box does not grow in
height to fill 100% of the height, even though I have it set to 100%
height.)
2) Why do the container objects not grow to contain the child objects?
I.e., whe all that is in the righthand box is "lorem ipsum" the box with
"True/False" in it goes outside the master container objects the (green and
blue borders).

 

[Nick Howes]

2) Why do the container objects not grow to contain the child objects?
I.e., whe all that is in the righthand box is "lorem ipsum" the box with
"True/False" in it goes outside the master container objects the (green and
blue borders).

because sometimes you want this, eg if a picture is floated in a paragraph
you want it to follwo through to the next apragraph, not make a big gap.

you can force the gap by putting a <div style="clear:both"><!-- --></div> at
the bottom of a div.