Box row with property fields "shakes" when changing the value

I'm playing around with the UIElements and am having a problem with some row layout stuff. I have two boxes next to each other in a row, but they "shake" for a frame or so sometimes when you change the value.

Here's a demonstration:

This is my UXML file:

Code (JavaScript):

1. <?xml version="1.0" encoding="utf-8"?>
2. <UXML xmlns="UnityEngine.UIElements" xmlns:e="UnityEditor.UIElements">
3.   <Label text="Hello World! From UXML" />
4.   <VisualElement class="box-row">
5.     <Box class="box">
6.       <Label text="Damage" class="header" />
7.       <e:IntegerField label="Base Damage" binding-path="BaseDamage" />
8.       <e:IntegerField label="Damage Per Level" binding-path="DamagePerLevel" />
9.     </Box>
10.     <Box class="box">
11.       <Label text="Not Damage..." class="header" />
12.       <e:IntegerField label="Base Damage" binding-path="BaseDamage" />
13.       <e:IntegerField label="Damage Per Level" binding-path="DamagePerLevel" />
14.     </Box>
15.   </VisualElement>
16. </UXML>

This is my styles file:

Code (JavaScript):

1.  
2. .box-row {
3.     flex-direction: row;
4. }
5.  
6. .box {
7.     flex-grow: 1;
8.     padding: 5px;
9.     margin: 2px;
10. }
11.  
12. .header {
13.     -unity-font-style: bold;
14. }

If it matters, here's the custom editor file but it doesn't do anything special:
https://gist.github.com/VapidLinus/f6b23956d6ec076f9ded39e254cc790e

Anyone knows why it does this, or how to fix it?