html - Footer Background image shrinks when changing width of window -


I have a footer created for a website, but for some reason when I change the width of the window As the background image just disappears from the right side, I am shrinking the width of the window

The footer spreads to 100% below the screen and does so until I see the width of the window one Does not start shrinking at a certain point.

You can see an example of my problem

Any idea how to fix it? I'm totally stumped, maybe I did something wrong in the width?

example

width of #footer is set to auto , and the content inside ( # content-wrapper < / Code>) has a fixed width.

This is due to the horizontal bar appear

To solve it, you can enter overflow: hidden to the original unit ( #footer ).

Try it out:

  #footer {background-image: url ("images / footer-bg.png"); Double-repeat: repeat-x; Height: 451px; Margin: Auto 0; Width: 100%; Hidden flurry; //what you're looking for. }   

If you also want the inner div ( # content-wrapper ) to change your shape dynamically, instead of the pixel dimension for width Use one percent:

  #footer # content-wrapper {height: 451px; Margins: Auto; Width: 83%; }    

Comments