Hi all, i am stumped. I am trying to get a footer background that is 100% page width. Although, the footer is in the container and the background image is only the width of the container.

 

So the question is, how can i make it the body width, and not the container width?

 

Thanks in advance.

Hi all, i am stumped. I am trying to get a footer background that is 100% page width. Although, the footer is in the container and the background image is only the width of the container.

 

So the question is, how can i make it the body width, and not the container width?

 

Thanks in advance.

 

whats the background image like? is it a simple gradient, repeated pattern or is it an photo? if its an image, its likely to lose quality unless its a high res photo

 

Also if you want it full width of the screen and not of the container, youve got to take it out of the container and move it below the container or you need to put the container to 100% of the screen, and put a container inside of that container for everthing else, and then have the footer inside the first container but not the second container

its a blue colour, simple, repeated on the x axis. the problem is, i am using margin: auto. How can i implement this with padding?

its a blue colour, simple, repeated on the x axis. the problem is, i am using margin: auto. How can i implement this with padding?

 

even if your using margin auto and set something as 100% not within anything else it will still cover the full width of the page as far as i know, and what do you mean how can you implement this with padding?

well, i have content in the footer, and i want that within the container, but i want the margins to be auto, of course when i put this on the css, the background image compresses to the size. I want 100% width background, with margin:auto. Thanks.

well, i have content in the footer, and i want that within the container, but i want the margins to be auto, of course when i put this on the css, the background image compresses to the size. I want 100% width background, with margin:auto. Thanks.

 

can you please draw on paint what you want and post it, your not making any sense, if you have the footer 100% it doesnt need margins left and right as auto

If its a repeated image just put it in an empty div outside of your main wrapper.

So it will look something like this...

 

<div id="wrapper">

Main Content Here....

</div>

<div id="footer_tile">
</div>

 

Then in your CSS...

 

#footer_tile {
height: 0; /* replace with the height of your footer tile */
width: 100%;
}

 

Should do the trick if I haven't forgot anything.

(I know empty divs are bad practise but they are sometimes an easier way around things).

thanks for your help, all sorted

thanks for your help, all sorted

 

thats exactly what i said to do in the first place :s obviously you needed the code feeding to you like a 2 year old instead of listening and learning doing it yourself

i did not use that code, sorted by myself. but thanks for your help.