Fixed the justified issue.
See demo. Also updated
X3 release to
X3 0.21.3.
Strange/stupid issue: Justified layout is created by setting WIDTH of images from a script that calculates rows. The WIDTHS set on images include DECIMALS ... If we didn't include decimals to the width, but rounded DOWN instead, that could lead to 3-4px empty space on the right of screen because the total width of all images in a row would be less than that available. Of course, we could not round UP either, as that would lead to last image in a row breaking into a new line.
I diagnosed calculated width, and it was 100% correct. But then I checked the ACTUAL width of images in various browsers
, and it seems they do not always respect the decimal pixel width, and choose to apply their own decimal-rounding. See Firefox for example here, rounds my 406.29px to 406.283px:
If I knew that the browser always rounded DOWN the decimal somehow, then there would be no problem. However, since it could have rounded ip to for example
406.295px, this means the last item in the row would be pushed off the edge, and basically break the entire layout.
I have now rounded set width to ONE decimal (for example
406.2px), which seems to be respected by browsers, and seems to have solved the problem.