Moving all four separated anchors together and preserving relative sizes.

So say I have the four anchors spread out, how do I move all simultaneously so as to keep the proportions correct so as to make them square? The percentages it shows are useless as the canvas itself isn't square. Or more so, how do I keep them square in the first place as shift dragging has no effect on them?

Furthermore, where and how should I go about placing them if I want my UI to scale so at all sizes the UI is exactly the same, just smaller/bigger, so no absolute pixel borders?

Thanks.

 

You need to put a Reference Resolution component on your canvas if you want the UI to scale up with the screen size (for a WYSIWYG across all screens).

If you're developing for PC, I'd also recommend moving the Match Width or Height slider all the way to the right. This will get you set up so that your UI will appear properly on all screen widths.