Have a profile photo cut a banner in its middle

I have some troubles with responsivess : I want my round profile photo to “cut” the banner like this :
photo avant.
But here is how it looks like when I make these elements not fixed-width :

I don’t manage to make so that, no matter the size, it looks like the image 1.
Thank you very much if you know how to do so