Adaptive Number of Columns

Fixed Width Columns

In many use cases, the columns have a standard width and you want display to fill the available width.

This a achieved by setting the columnWidth attribute to the number of pixels.

There are gaps at the sides, how do I get the columns to fill the entire container?
The best way to do that is not use columnWidth, but to set the columns based on a screen width.

var orderedColumns = document.getElementById('orderedColumns'); function resize(){ if(orderedColumns.clientWidth < 600){ orderedColumns.count = 1; }else if(orderedColumns.clientWidth < 1000){ orderedColumns.count = 2; }else{ orderedColumns.count = 3; } } window.addEventListener('resize', resize);