Small css problem

[freecrm]

Hope this is simple lol.

I have a fairly standard layout with fixed width #wrapper and auto padding left and right.

I am trying to get a status bar div to sit over a header image (z-index 2000), but it is stuck relative to the right of the browser edge.. not the wrapper. In effect, when the browser window increases in size, the general layout borders stretch to suit, but this div stays to the right, moving it off the place I want it to be.

If I set position as relative or static, the div forms it's own box and shunts the other divs down out of position - i.e. not sitting in a layer over the header img.

This statusbar div is between the #wrapper div tags.

css

.statusbar{
        position: absolute;
        color:#006666;
        width: auto;
        z-index: 2000;
        right: 10px;
        top: 70px;
    }

You can see my problem on the test page at http://www.freecrm.x10hosting.com/css2/csstest.php

The problem area is the "you are logged is as" section top right

Any ideas?

 

[garrensilverwing]

instead of putting the image in there as an object why not put it as the background to the header div. That way you can put the status bar div's position to relative and float it to the right inside the header div. that way instead of it hugging the side of the body (from the absolute positioning) and hug the right side of the header div.

 

[freecrm]

instead of putting the image in there as an object why not put it as the background to the header div. That way you can put the status bar div's position to relative and float it to the right inside the header div. that way instead of it hugging the side of the body (from the absolute positioning) and hug the right side of the header div.

Now why didn't I think of that...

Thanks for this - I'm sure it will work fine.

Rich


EDIT
__________

Worked a treat! - had some minor issues with positioning and <p> tags but got it sorted and looks great - thanks.