Floating point percentage inaccruacy? Can't accruate set fixed number of flexible columns

[Glidias]

Why does even a 33% width not set it to 3 columns all the time? I have to set it to 30% in order for it to not push it down to next line. The same goes for 50%. 50% sometimes results in breaking down to next line and not forming 2 columns, and i have to create a leeway of (48% or something...) to avoid breaks.

var wookmark;
      imagesLoaded('#container', function() {
        wookmark = new Wookmark('#container', {
         itemWidth: (33+"%"), // Optional min width of a grid item
          outerOffset: 20, // Optional the distance from grid to parent
          flexibleWidth: function () {
            // Return a maximum width depending on the viewport
            return getWindowWidth() < 1024 ? '33%' : '33%';
          }
        });
      });
    })();

 var gallery = new Wookmark('#index-gallery-section', {
              offset : 10, // Optional, the distance to the containers border
             // autoResize :true,
              flexibleWidth:true// (100/3-3)+"%"
             , itemWidth: function() {  return  (!breakPts[1].matches) ? (100/2-2)+"%" :  (100/3-2)+"%"; } 
          });

I'm quite confused as the API instructions and examples don't match. flexibleWidth is now a Boolean and not a function/widthValue. Likewise, i strangely discovered itemWidth can be used as a function as well, with flexibleWidth set as Boolean true and it'll apply. However, the calculation requires a slightly less percentage (eg. 48%, 30%) width, to prevent premature wrap-breaking of columns. Why?

Also, itemWidth runs for minWidth constraint, but what if I need a maxWidth constraint instead? Also, leaving itemWidth blank will treat everything at 0 width by default.

[Sebobo]

Hi @Glidias,

I'll have to check the documentation, maybe there is something out of date.

itemWidth and flexibleWidth can both be functions as you correctly found out, but this is also explained in the readme under itemWidth and flexibleWidth.

You need to specify a lesser percentage because of the offset value. If you want to only work with percentages you could for now set offset to 0 and create some spacing via css paddings.