Hello everyone. I am working on the survey form project and I wanted some help. I wanted to add a blurred background image behind the form before starting to add things and found a way to do it after a while.
Where I get stuck is that in order to add text etc. above the image, you have to use position: absolute and I set the top and left to 50% but it didn’t center it. So then I found out about transform: translate and just adding transform: translate (-50%, -50%) in addition to top and left 50% centered it.
Can someone explain why that happened? Why didn’t it center it with just top and left at 50% and what exactly did transform do?
Here is the pen if anyone can check it out and give me an explanation I’d be grateful.