Positioning a background image is not always an easy task for responsive sites because its correct visualization depends on the behavior of its contents.
Just to clarify, let me show you a sample of this problem:
The problem is that sometimes we fix the content to keep the background still correct and it needs to change. There are two plugins that help a lot in positioning this background: Anystretch and Backstretch.
Anystretch is a jQuery plugin that allows you to add a dynamically-resized background image to any page or block-level element. Originally, Anystretch was forked from Backstretch.
The image will stretch to fit the page/element and will be automatically resized as the window size changes. There are some options to configure it such as horizontal positioning, vertical positioning, speed, positioning of the element, and data name.