CSS3 Multi-column printing of a webpage
I have written some reports for a real estate brokerage I am building a site for, they are printouts of all the agents 300 or so. The office uses these as phone lists. They wanted it to print out mulitcolum like MS-Word multicolumn. Trouble is if I made it one huge table spit in 2 columns you would get a-m in column one and n-z in column 2, not flowing on each printed page. Enter CSS3.
I heard about CSS3 support in some browsers, and though I would give it a try in firefox.
<style type="text/css">
#wrap {
-moz-column-width:20em;
-moz-column-count: 3;
-moz-column-gap: 20px;
}
</style>
Here is the CSS code for a <div id='wrap'>list goes here</div>.
Works great.