can I use position or other CSS to fix this header problem...?

Discussion in 'CSS' started by mandini76, Jul 27, 2008.

  1. #1
    I am working on a site with a header graphic that I want to be at 100% of the browser width... however I want the page content to be fixed at 1000 px and be in the center of the page.

    The problem is that the header doesn't line up with the header background...

    The header background graphic is 1280 wide (my max browser width). I have it as a background image in a div that is 100% width. On top of it is the same image cropped to 1000 in a 1000 width div.

    anyway is there any way I can get this to line up using CSS, or have the image always be in the background?

    Thanks so much... Hope this makes sense!

    Wide browser - header pattern is fluent, content is centered
    [​IMG]

    Narrowed browser - content centered but pattern is broken
    [​IMG]
     
    mandini76, Jul 27, 2008 IP
  2. Awesome Ninja

    Awesome Ninja Peon

    Messages:
    141
    Likes Received:
    3
    Best Answers:
    0
    Trophy Points:
    0
    #2
    Add a fixed/min width to the body which is the side of your full header,
    replace xxx with the width.

    
    
    body {
    width: xxxpx;
    }
    
    
    Code (markup):
     
    Awesome Ninja, Jul 27, 2008 IP