Permalink
Browse files

Adding column-fill:auto to pagination style rules.

This change is forced by Firefox 12:

  https://bugzilla.mozilla.org/show_bug.cgi?id=725485

Which has been updated:

  http://hg.mozilla.org/mozilla-central/rev/93b804e5f3f5

To follow the W3C css-multicol specification for column-fill:

  http://www.w3.org/TR/css3-multicol/#column-fill

I'm sure there's a good reason why the default value for column-fill is
'balance', not 'auto', but it eludes me. Anyway, Monocle was broken in
Firefox alpha releases -- this fixes it.
  • Loading branch information...
1 parent a85ff90 commit db8d14f830fe12181220a38fb7bc128202e2e5e1 @joseph committed Feb 13, 2012
View
@@ -147,12 +147,16 @@ Monocle.Env = function () {
"width:100%",
"-webkit-column-width:"+testFrameSize+"px",
"-webkit-column-gap:0",
+ "-webkit-column-fill:auto",
"-moz-column-width:"+testFrameSize+"px",
"-moz-column-gap:0",
+ "-moz-column-fill:auto",
"-o-column-width:"+testFrameSize+"px",
"-o-column-gap:0",
+ "-o-column-fill:auto",
"column-width:"+testFrameSize+"px",
- "column-gap:0"
+ "column-gap:0",
+ "column-fill:auto"
].join(";"));
if (bd.scrollHeight > testFrameSize) {
bd.style.cssText += ["min-width:200%", "overflow:hidden"].join(";");
@@ -37,6 +37,7 @@ Monocle.Dimensions.Columns = function (pageDiv) {
var rules = Monocle.Styles.rulesToString(k.STYLE["columned"]);
rules += Monocle.Browser.css.toCSSDeclaration('column-width', pdims.col+'px');
rules += Monocle.Browser.css.toCSSDeclaration('column-gap', k.GAP+'px');
+ rules += Monocle.Browser.css.toCSSDeclaration('column-fill', 'auto');
rules += Monocle.Browser.css.toCSSDeclaration('transform', 'translateX(0)');
if (Monocle.Browser.env.forceColumns && ce.scrollHeight > pdims.height) {
@@ -15,6 +15,8 @@ section {
-webkit-column-width: 300px;
-moz-column-gap: 20px;
-webkit-column-gap: 20px;
+ -moz-column-fill: auto;
+ -webkit-column-fill: auto;
height: 380px;
}
.colCntr {
@@ -16,6 +16,10 @@
-moz-column-gap: 0;
-o-column-gap: 0;
column-gap: 0;
+ -webkit-column-fill: auto;
+ -moz-column-fill: auto;
+ -o-column-fill: auto;
+ column-fill: auto;
}
/* Force columns in everything except old WebKit.*/
@@ -41,6 +41,14 @@ body {
-moz-column-gap: 0;
-o-column-gap: 0;
column-gap: 0;
+
+ /*
+ Since Firefox 12, it's necessary to set column-fill specifically.
+ */
+ -webkit-column-fill: auto;
+ -moz-column-fill: auto;
+ -o-column-fill: auto;
+ column-fill: auto;
}

0 comments on commit db8d14f

Please sign in to comment.