This is because you are using relative positioning.
The way you are positioning these pictures, I would advise you to use Absolute positioning for the images.
If you place them relatively, they are placed one after the other and interfere with eachother.
You should put the images in its own div and then set the div to relative. The columns you’re using will scale to the width of the page since you have not set a width to them, meaning you’ll end up with lots of air.
You have added everything to the same div. Often when things don’t look right you can solve it by putting divs inside divs. Put the images only inside a div, which is inside a div. Put the other stuff you want on the same height into other divs, then try setting the first div to flex for easy manipulation / sorting etc.