automatic adjustment of div height given absolute value with css

I'm trying to make a square on all devices with CSS, but unfortunately it doesn't work because I'm using % instead of px. I have searched for this situation in many places on the internet, but all the results I have found use px or cm values. Could someone with knowledge help with this?
Thank you.
css:

View on Stack Overflow