Trying to get zoom to work when a width and ht are added to the outside layer

#1

Zoom works here:
https://jsfiddle.net/9stz71nv/1/

image

Zoom isn’t working properly when it is set like this.

Where a width and height are added to the outside layer.

How would I fix that?

The image is supposed to get bigger as you zoom in, but it’s not doing that.
https://jsfiddle.net/ovxr5gzn/1/

image

#2

Try the suggestions in this post:

https://www.sitepoint.com/community/t/svg-is-stuck-behind-the-image/329607/4