Jump to content

- - - - -

How to make header and footer width 100%

This topic has been archived. This means that you cannot reply to this topic.
2 replies to this topic

#1   Rachel Brex

Rachel Brex
  • Members
  • 8 posts

Posted 27 April 2012 - 04:20

Hi, this is my shop's current layout below. I'd like to make the width of the header and footer 100% instead of 960px or at least make a header/footer wrapper that is 100% and the header/footer content's width 960px so that the bottom border extends the full length of the browser. (Hope that makes sense, I've tried to illustrate this with the red borders)

How can I do this? What should I be changing in the 960_24_col css, if that's even the way to go about it.


#2   burt


    I drink and I know things

  • Community Team
  • 11,868 posts

Posted 27 April 2012 - 10:15

Take the header and footer outside of the container_24

You may then need to amend the code inside the header and footer to display nicely.


The alternative is the stay within the 960 boundary and simply make a false background, example:

http://oscbooks.com/...e/231-large.gif - the 960 ends at the vertical black lines - the tiny bits of green outside those black lines extend across the full browser (they are cut off in the image).

Another alternative is to dump the 960 fixed width and use a fluid 960 instead - have a hunt in Google.
For that I used .css to place the

This is a signature that appears on all my posts.  It is not specifically aimed at you.


IF YOU MAKE A POST REQUESTING HELP...please state the exact version of osCommerce that you are using. THANKS
If you are still on the old style osCommerce, it is time to move to Responsive.


#3   Rachel Brex

Rachel Brex
  • Members
  • 8 posts

Posted 28 April 2012 - 01:50

Ah thank you! The first solution worked and no tweaking was needed. Perfect.