How to create a responsive horizontal line using css

I’ve been trying to use media queries to change this vertical line to a horizontal line. I’ve been able to do that but now I want to make it responsive to the images. When the images are bigger it crosses the horizontal line rather than adjusting to the size of the image. Please help me. I will really appreciate. Here is my code:

Can you give an example of what you have tried because all I see is a horizontal hr.

BTW, the img element is an empty element it does not have a closing tag.