Thanks for posting this.
What is going on here is that the VBox has display: flex, and by default the children (the checkboxes) have flex-shrink: 1. This means that they will try to shrink (vertically, since it's a vertical flex layout) to fit the space. I played with some options by right clicking the checkbox in Chrome and choosing "Inspect", and then modifying the CSS. There's a number of ways to deal with this:
1. Set the VBox layout.display to something other than 'flex' (for example, 'block')
2. For each checkbox, set the layout.flex to '0 0 28px' (that sets the flex-shrink factor to 0 and the natural height to 28px, matching its normal size). (Note that you can create one Layout instance that you then use for all of the checkboxes)
3. For each checkbox, set the layout.min_height to '28px' to force it to be at least that high
Thanks,
Jason