How do I format HTML into two columns similar to how MS Word does it?

Question

In Microsoft Word there is an option where you can separate the text in two columns as follows:

Exam

The content has images and lists. All the content needs to continue normally as in the image. I've tried doing it with CSS3 but manually not dynamically (because I will have to load the content and then make operations to re-order the elements but I'm not sure if it will work):

http://joseadrian.com/stackoverflow/columns.php

Is there a way to do that with HTML (5) + JavaScript + CSS (3)? If so... creating a file with PHP giving it that structure will work?

How does it know where to split? Where is the option? I can't find it in MS Word 2007 — mowwwalker, Sep 29 '11 at 19:49
I'm looking for it now because I remember I did it a few years ago. — Jose Adrian, Sep 29 '11 at 19:51
possible duplicate of [Automatic two columns with CSS or JavaScript](http://stackoverflow.com/questions/194803/automatic-two-columns-with-css-or-javascript) — JJJ, Sep 29 '11 at 19:52
You're looking for this stuff: http://www.w3.org/TR/css3-multicol/#column-count not sure how widely supported it is. — Incognito, Sep 29 '11 at 19:57
You can get such a layout with alternating float=left/right elements. But you have to specify the column breaks manually. CSS is not very clever in calculating vertical lengths. — ceving, Sep 29 '11 at 20:06

score 2 · Accepted Answer · answered Sep 29 '11 at 19:55

CSS isn't smart enough to make decisions like "when this column, which is 600px high is full, wrap the text into the next column". You'll need to do this using JavaScript.

see: http://dancameron.org/code/splitting-content-into-two-columns-e-g-word-wrap-with-php-or-css-javascript

How do I format HTML into two columns similar to how MS Word does it?

1 Answers1