Clicking on elements inside of a 3d-rotated element?

So I am having an issue with a little website that I am building.

I used CSS transform to place 3 images as walls (each inside its own div). Inside the divs of the images I have smaller divs that the user should be able to click on.

However, the clickable boundary of the smaller divs is not affected by the 3d transform. Meaning that it stays 2d and is offset from the visual element.

Or at least that is what I think is happening. In any case, the clickable area doesn't match up with the visual placement of the little div, and I have no idea how to fix that ...

Does anyone have an idea why this might be happening? And even better, how to fix it?

Do you use any 3d transform on the back wall? If so, can you place it without transforming it?

However you can try to apply the wall's style on the clickable div area too. (probably something as transform: scale(0.5);).

You may try to apply transform-style: preserve-3d; to your elements as well.