Separation is your friend in this case.
Separate the "content" image from the background image. Cut the section of the background image that will repeat itself and use that as a background image for the body. Then apply it to the top and set repeat-x, like so:
overflow: hidden; is only needed in case the image might be larger then the browser width, because it might create a nasty looking scroll bar.
#color is optional, if you want a default color of background, where the image does not cover.
After doing so, apply the content image where you’d normally apply it. use absolute positioning if needed.