Why don't elements scale proportionally, relative to everything else?

Can anyone please help? I just can't figure it out. My animation is set up (I believe) to scale proportionally: scene is set to scale 100%, and every element is pinned to all 4 sides, automatically size horizontal and vertical, and scale behavior is "shrink to fit".

The problem is that the elements are only scaled properly when the scene is wide enough to fit all elements at their "native" size: When the browser is resized smaller, everything scales proportionally, but not relative to everything else...so it all looks distorted. At certain widths, some elements are so small they are 0px wide:

What am I doing wrong?? The URL with the animation is here--note, I'm using a waypoint to start the animation, so scroll down to the white ection, and make sure your browser width is wide enough, then reduce the width and you'll see what I mean: http://conevity.infinitemonkeys.ca/

I've also attached the hype file. Using Hype 3.5 Pro

braintree.hype.zip (106.3 KB)

Use grouping to affect more than one element and keep them proportional with other elements.

Is this what you wanted to happen?

braintree-vDBear.hype.zip (119.1 KB)

1 Like