If you want to try the Firefox 1.5b1 CSS3-like columns feature, change your modern/css/screen.css like this (the change is for #page):

--- orig/wiki/htdocs/modern/css/screen.css
+++ mod/wiki/htdocs/modern/css/screen.css
@@ -276,6 +276,14 @@
    background-color: white;
    margin: 0;
    padding: 10px 30px 20px 30px;
+    
+    /* theses are some Firefox 1.5b1 specific extensions, see also the CSS3 draft.
+       -moz-column-count: 2;    we better set the column width, so it adapts to screen width
+       the column rule is not implemented yet (as of FF 1.5b1)
+     */
+    -moz-column-width: 30em;
+    -moz-column-gap: 2em;
+    /* -moz-column-rule: solid black 0.3em; doesn't work yet! */
 }
 
 /* We use here dumb css1 ids because of IE suckiness */

The feature allows the browser to lay out the page content in multiple columns which are automatically balanced to have similar height. This likely works best for sites that have content that fits within a browser window; too much more and the user may end up scrolling up and down to go back to the top of the next column.

See also the CSS3 Columns documentation at the Mozilla Developer Center.

MoinMoin: Css3Columns (last edited 2007-10-29 19:19:42 by localhost)