Horizontal navbar not aligning with Body background upon resizing

HTML & CSS
1

I have a body background image that is set to repeat on the x-axis. Then I have a wrapper div with a width of 940. Upon resizing to smaller sizes, the background image on the body doesn’t scale properly unless it’s 50%. The dimension of the body png is 84 x 150. Is there any way to get it to scale right?

http://www.nvcc.edu/home/ssuh/test/



body {
	background: url(../img/body.png) repeat-x #f4f4f4 top left;

}
#wrap {
	width: 940px;
	background-color: #fff;
	margin: 0 auto;
	
}

#title-bar {
	background: url(../img/topBarBg.png) repeat-x bottom;
	height: 50px;
	display: block;

}
2

Do you have a screenshot of what it looks like for you when you scale the browser down as I was unable to replicate the issue you’re describing, also instead of using a background image on the body it would be a lot more efficient to set a background colour on your #title-bar selector then separate your #wrap selector into a class that can be re-used on both your #header and #title-bar elements.

3