CSS Flyout Header with Upscale Boutique

Hello, not sure if I am posting this in the right place or not.

I am tring to add the CSS Flyout Header with the Upscale Botique template and have hit a wall....as usual.

Anyway - here is the site. http://www.facetsofgem.com/cart/index.php

Once I installed the menu, the picture on top of it raised and the menu is overlapping the main part. I would like to:

1 - Align the menu so there is no overlap there on the right end.
2 - move the menu up so it is not hanging over the main part.
3 - remove the picture (not the logo) at the top and move the header(the logoad what not) down on top of the menu.

If anyone could help, I would appreciate it.

Thanks

In stylesheet_header_menu.css change:

Code:

---

div#dropMenu {
width:100%;
margin:0 auto;
text-align:center;
z-index:1000;
position:relative;
        }

---

to:

Code:

---

div#dropMenu {
width:100%;
margin:0 auto;
text-align:center;
z-index:1000;
position:relative;
top:-30px;
        }

---

to move the menu up.

Quote:

---

3 - remove the picture (not the logo) at the top and move the header(the logoad what not) down on top of the menu.

---

In stylesheet.css replace:

Code:

---

#logoWrapper {
background-image: url(../images/back12.jpg);
height: 50px;
width: 948px;
position: relative;
margin: 0px;
border:1px solid #8b775f;
}

---

with:

Code:

---

#logoWrapper {}

---

Thanks! Now time to change the footer :dontgetit

Ok - so far the only thing I need now is find out how to get rid of the white space between the search box in the header, and the horizontal menu.

Any idea's? I did the following already.

PHP Code:

---

#logoWrapper {} 


---

In stylesheet.css change:

Code:

---

#contentMainWrapper {
margin-top:-30px;
border-right:1px solid #8b775f;
border-left:1px solid #8b775f;
}

---

to:

Code:

---

#contentMainWrapper {
margin-top:-60px;
border-right:1px solid #8b775f;
border-left:1px solid #8b775f;
}

---

and in stylesheet_header_menu.css change:

Code:

---

div#dropMenu {
width:100%;
margin:0 auto;
text-align:center;
z-index:1000;
position:relative;
top:-30px;
        }

---

to:

Code:

---

div#dropMenu {
width:100%;
margin:0 auto;
text-align:center;
z-index:1000;
position:relative;
top:-60px;
        }

---

Perfect!

When I did that change it worked in everything but IE, but I was able to fix that. :blink:

Thanks again!

It's me again. :blush:

http://www.facetsofgem.com/cart/

If you will notice on the site, above the menu is that white space. I know where to change the color to the background, but it also changes the main part and the footer. For now I want to only keep the main part white.

How can I do that, plus get rid of the excess space at the top?

Having a bit of a problem with getting the border to show up on the outside of the footer to line up the side - but, I'm working on that and trying to figure it out.

Sheesh - just when I thought I had it under control. :unsure:

Any idea's on the previous post? I'm stuck :frusty:

Any help would be appreciated.

Thanks

Never mind, I got it. :clap: