Sides creep right and left when repeatedly dragging about split HOT 12 CLOSED

After switching to getBoundingClientRect() and getting exact widths as floats, the issue is still there. So it must be something else.

from split.

I have never seen the right edge creep right, only left.

from split.

Yes, should have phrased that better. That's correct.

from split.

I activated the Firefox Developer Tools Inspector and looked at the widths of the panes in the three-pane example.
Before dragging any gutters, the widths were, from left to right, 33.3333%-5px 33.3333%-10px 33.3333%-5px -- all good.
After dragging the leftmost gutter slightly left, the widths were 30.4802%-5px 32.4635%-10px 33.3333%-5px.
Thus, the sum of the widths of the left and center panes, before allowing for gutters, went from 66.6666% to 62.9437%.
I still don't see why, though.

from split.

Is it the scrollbars? Does clientWidth include the scrollbars? If it does not, ...

from split.

Ah! Wasn't counting the half gutters on each side of the pair. Check out feb2e68, it gets it a lot closer. Still moves a bit.

from split.

clientWidth of the parent is 958. clientWidths of the three panes are -- in the three-pane example, before any gutter-dragging -- 299 294 299 which sum to 892. The two gutters total 20, bringing the total to 912.
The missing amount is 46 pixels. If it's the scrollbars, divide by three and get 15 pixels each, with one pixel left over. Doesn't quite look right -- the scrollbars don't look 50% larger than the gutters -- but where else would the missing pixels be hiding?
I think the calculation of this.percentage should not use parent.clientWidth in the denominator: using it makes the denominator too big.

from split.

The scroll bars are definitely counted. But you're right, there's a pixel missing (1.333px by my count after the last commits).

from split.

It might be a difference between CSS calc() and the math in the script. calc(33.333% - 5px) is 314.333 according to the browser. If I do the math, I get 314.68. Going to read up on how calc() works.

from split.

If you try the latest version I think I solved it. The script was counting the parent borders, while CSS calc() was not. 2 pixels off was enough to make the side creep left.

from split.

I think you've got it! Thanks!

from split.

Thank you for help debugging it!

from split.