How can I use relative positioning but when enlarged the elements act as if they're absolutely positioned?

Question

I have an example here:

https://www.rgraph.net/canvas/howto-space.html#example

It's four canvas tags organized in a DIV, using absolute positioning within that DIV so that each canvas is justified to each corner of the DIV. When the canvas tags are clicked on they are enlarged using CSS but because each is absolutely positioned it doesn't affect the other canvas tags.

How can I change these canvas tags to use static positioning but still have it that when they're clicked on and change size it doesn't affect the other canvas tags? Is this even possible?

Thanks.