I’m trying to make a responsive webpage depicting a certain layout, but when viewed with different magnification or resolutions, the whole layout breaks down. I wanted to make child divs change size while respecting its relative positions in the parent div. Child divs change size along viewpoint, but the position stays in the same location.

So I made a website and I tried making it responsive but the dev tool looks different from my phone like in dev tool there is space to the left and in my phone there is space to the right when I zoom out like I don’t know which one will be displayed should I make it responsive by looking at my phone or dev tools btw I am using chrome dev tools

I’m making full screen pop up to work for one application.