I'm trying to take a static theme and convert it to Drupal, and I'm having a problem with a background image. You can see what I'm trying to convert from at www.campusfiresafety.org.
The problem is the graphic that is the brown border under the navigation bar at the top (under the banner). It is a 174px x 1px image that starts at the top of the page and goes down to just below the buttons. In looking at the Zen theme, what I would like to do is mimic, that, but the header div goes down and stops above the navbar div. My thought was to create a wrapper div that would encompass the header and navbar divs. The problem is that the navbar div is not directly adjacent to the header div: instead, it is after <div id="content">, and inside <div id="main-inner">, which is inside <div id="main">, which is adjacent to <div id="header">. Since the main div includes the page content, I can't wrap header and navbar as I would like. Can anybody give me an option of how to get the background image to go down through the navbar div? I supposed I could try moving the navbar div out of main, but I'm not the CSS guru, so I'd be afraid of messing the whole page up. The other option would be to cut down the div so it fits in the navbar div, I suppose.
You can see my attempt at http://dev.campusfiresafety.org.
On the same page, I also need to replace the text for each primary links with a button image and mouseover image. I've seen a few options for ways to do that. Does anybody have experience doing this, and suggestions of what way would be the easiest?
Thanks.
Steve