I have a problem with this page getting a script based header to show above my page.
What I'm trying to do is to have a header bar show above my page.

Here's the link to show what it looks like now:
http://upcstaging.rccomputersolutions.b … index.html

How do I get the black header bar above the page?

Here's part of the CSS file :

.gov_header {position:absolute; float:left;}

body {color:#000; font-size:12px; font-family:"Lucida Grande", "Lucida Sans Unicode", Arial, sans-serif; background:#fff url(../images/body_bg.jpg) left top repeat-x}
#wrapper {width:960px; margin:0 auto;}

#header {float:left; display:inline; width:945px; height:128px; margin-top:11px; padding-right:15px; background:url(../images/header_bg.jpg) left top}
#header img {float:left}

The red menu bars are floated right with relative positioning and inline display.

Here's what the page looks like without the header script:

http://upcstaging.rccomputersolutions.b … page2.html

I need to put the black bar above the page so that it doesn't sit on top of the header part of the page. In other words, I want it above the red line so it doesn't sit on top of it.

Any ideas how to do this?

Thanks,

Ron

looks to me as if you should be paying some attention to placing the utahgov_statewideheader id in there.

I'm sorry, but I'm not quite sure what you mean. No matter what I've tried in the CSS file for the class or ID for the header, it never goes above the red line at the top of my page.
It needs to look like this:

http://upcstaging.rccomputersolutions.biz/

I apologize for not including this in my post. The black Utah.gov bar should appear above the header of my page rather than on top of it. I've tried position: absolute with a negative margin (margin-top:-7em), but all that does is compress the height of the Utah.gov bar. Nothing I have tried moves it above like the page in the link.

I think it has something to do with the width or floating as compared to fixed width of the page, but I'm not sure.

Thanks

This Div needs to be defined in the CSS.
<div id="utahgov_statewideheader

Ron,
I would just remove the divs around the <script> tag for the state header and move that line inside the wrapper as follows:


If I understood your intentions correctly, this seems to work the way you wanted it when I quickly tested it here ...

Ron...why don't you take a look at the code for the page you mentioned...check out that css file and see how they achieved that.
This is the address I picked up for that code source:
view-source:http://upcstaging.rccomputersolutions.biz/css/default.css

Janys,
They did what I suggested above... The state header script is within the wrapper and without any CSS-styling.

Sorry Per...I only glanced at it briefly. But it's good that you managed to isolate the area to find a solution.

Ron,
What I suggested above does not go far enough. It positions the gov-header correctly (so it does not end up far off to the left on a big screen), but the repeat-header portion that you have defined in the CSS "body {}" is still hard up at the top. I think you need to define it in the .header instead, inline with your 'other' header image.
The closest I could get to what you want, in the limited time I have, is in the attached screenshot. Here I have replaced your header image (header_bg.jpg) with the repeated body_bg.jpg. I know this is not what you want, but it's part of the way there...
Instead of combining the two backgrounds in CSS, you could also combine them in a graphics program into a new, complete 'header_bg.jpg'...

I really appreciate the time you all took to help me out with this.

Thanks to your help, I can see how to make this work. I love using the Coffee cup software and now I'm also very impressed with the quality, helpfulness and kindness of the user community.

Thanks folks - you are awesome.

Ron