Table conversion to CSS

Do you have a question? Post it now! No Registration Necessary.  Now with pictures!

Threaded View
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:

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

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%
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).

Re: Table conversion to CSS

Quoted text here. Click to load it

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.

Site Timeline