Nested columns sometimes break due to rounding errors

[paulcpederson]

The two column-5 elements should fit into the column-10. But the column-5 is rounding to 302.08333px. So 302.08333 + 302.08333 = 604.16666 and then column-10 is only 604.16667px. I think the browser is rounding these partial pixel values sometimes correctly, sometimes incorrectly.

Could fix this by rounding all values to even pixels, maybe?

[paulcpederson]

I think an approach that would solve this would be to create a 1 column unit and use that for all column calculations. So:

$col-unit: $container-width / $column-count;

.column-12 {
  max-width: 12 * $col-unit;
}

[DominicGauthier]

I try your solution in my project and it'seem working find, but I work in less and I can use round function with decimal (http://lesscss.org/functions/#math-functions-round) for the value of col-unit. I can't find the same method in sass, but I found this : https://gist.github.com/terkel/4373420

.column-unit(@nbcolumn){@column-unit: round(@container-width / @nbcolumn,2);}

[HeathMeyette]

Assigning to Tim. @tim-white-esri please feel free to reassign to your team members that have additional bandwidth.

[paulcpederson]

will be fixed in the next relase