i have a background image on my site with centered content page as seen in screen shot. i have a footer background image that i want to fill 100% of screen width no matter screen size. if i set into a footer div then the browser horizontal scroll bar appears. is there away to prevent this scroll bar using a background image in a div?

i have a background image on my site with centered content page as seen in screen shot. i have a footer background image that i want to fill 100% of screen width no matter screen size. if i set into a footer div then the browser horizontal scroll bar appears. is there away to prevent this scroll bar using a background image in a div?

 

How big is your footer image? If it's bigger than the browser window it will give you a H-scroll.

 

You can't have it so there's no H-scroll on a small screen but it fills out the whole screen on a bigger one without implementing media queries. Width:100% will just allow the footer to take all the width it needs to display the content you put inside it and I'm assuming your footer image is too big for your browser window.

my footer is the same width as the background image which is 1600px

Add

x-overflow: hidden;

To the body

if i set into a footer div then the browser horizontal scroll bar appears. is there away to prevent this scroll bar using a background image in a div?

 

I think you should post your code. A background-image doesn't cause a horizontal scrollbar, there must be another cause. Do you mean an img src tag?