Question

Ok, this will probably be simple to resolve, but I am a graphic designer & not a developer so wondering if someone can help me out. I have played around with positions but not such luck.

So I have a header div with a backgroud image within it, but when I preview the html/css on ebay the background image within this div appears at the top of the browser (conflicting with the ebay standard header) & not being positioned relative to the container div it is placed in. So basically the bg image is outside the div. I need it to be contained with the div I want it in.

Any help would be appreciated. (This may be a repetitive topic, so sorry about that)

Code:

<div id="HeaderContainer">
  <div id="BGHeader"></div>
</div>

    #HeaderContainer{
        position:relative;
    }

    #BGHeader {
        position:absolute;
        top:0;
        height:420px;
        width:100%;
        background-image:url(imagehere.jpg);
        background-repeat:repeat-x;
    }

Answer 1

You should post your html and css. At least the relevant parts. But having not seen them I would say my best guess is you’re using absolute positioning on the header.
You need to wrap that in another element that’s relative positioned.

<div id="container">
    <header>header here</header>
</div>

where your css is like so:

#container{
    position:relative;
}

header{
    position:absolute;
    top:0;
    left:0;
}

If I’m wrong about your needs or situation let me know and I can update.