Desperate for help with MENU!!!

[mouthtrick2009]

I've tried everything under the sun and am out of ideas on how to fix this.

The problem is with my menu at this site:

http://www.chasingamylive.com/zencart

Notice how the last menu item, Archive, is showing up two lines below where it should align with the rest of the menu.

Here's the code:

.menu{background:url(../images/menu_tall.gif) repeat-x left top; margin-bottom:5px; text-align:left;}
.menu .in1{background:url(../images/menu_left.gif) no-repeat left top;}
.menu .in2{background:url(../images/menu_right.gif) no-repeat right top; height:47px; padding:0;}
.menu .in3{padding: 0 0 0 0; text-align:left; overflow:hidden;}
.menu ul{list-style:none; font-family:Arial, Helvetica, sans-serif; font-size:12px;}

.menu ul li{float:left; background:url(../images/menu_bg.gif) no-repeat right top; display:block; width:127px;}
.menu ul li.last{float:left; background:none; display:block; width:121px;}
.menu ul li a{text-decoration:none; color:#FFFFFF;}
.menu ul li span{display:block; padding:13px 0 17px 0; text-align:center;}
.menu ul li a:hover{text-decoration:underline;}

Can somebody please help me with this? I have to get it fixed FAST but everything I tried just keeps it like this.

THANKS!!!!!

[stevesh]

Looks OK here in IE6, 7 and 8 and Firefox.

Your home page never completely loads for me - might be that Flash thing.

[mouthtrick2009]

Really? I loaded it in Firefox and IE8 and the Archive menu is lower...strange.

[rstevenson]

Well, I see a stylesheet.css file, another called stylesheet_main.css and another called stylesheet_tm.css, as well as stylesheet_css_buttons.css. Are you sure you know how the four of them are interacting? Did the TM template come with the css buttons contribution included? If not, it can be very difficult to modify TM templates, as you may be finding out.

Rob

[mouthtrick2009]

stylesheet.css contols the warnings & some navigator stuff

stylesheet_tm.css controls the header and footer boxes, menu boxes, and ezpage boxes, products boxes.

stylesheet_boxes controls the layout of the sideboxes.

stylesheet_main contols category, shopping cart, shipping estimator, etc.

I didn't write it, it was a template that was used. I can manipulate the properties in the stylesheet_tm file for the menu boxes and see changes so I know that's the right area. it's just odd that the last one falls off. In the above quote I showed all the code connected to the menu box.

What's odd is it looks fine in some browsers, but not others. So, to answer your question, yes, I'm aware of what these files control.

[gjh42]

The footer menu works fine, it is the header menu that malfunctions - and the Archives link ends up "hiding" in the gutter between header and body so it is hard to see.

A very odd case, as if the width of the ".last" item is cut from 121px to 11px or so, it jumps up halfway to where it should be but no further. Increase it to 181px or so and it drops to the start of the next row like a left-floated element should when it is out of space. Firebug doesn't show anything extraneous that applies to that link.

[mouthtrick2009]

The footer menu works fine, it is the header menu that malfunctions - and the Archives link ends up "hiding" in the gutter between header and body so it is hard to see.

A very odd case, as if the width of the ".last" item is cut from 121px to 11px or so, it jumps up halfway to where it should be but no further. Increase it to 181px or so and it drops to the start of the next row like a left-floated element should when it is out of space. Firebug doesn't show anything extraneous that applies to that link.

Yea, I tried all that. It's like there's some padding or something that won't allow it to go any further so it puts it on the next line. I can't figure it out. I've torn it apart, rebuild it, and still the same thing.

The client wants it fixed but I'm just sitting here with my thumb up my...well, you get where I'm going with this. I can't offer them a solution.

[rstevenson]

Not sure if this will help, but...

(OS X v10.6.2, most recent browser versions all around)

In Safari and Opera the problem seems to be as you describe it, with just the last link, Archives, being down just at the top of the orange box containing Search. But in Firefox, both Archives and Crew Items are below the others, though not as far down as the other browsers show, and the thin dark gray vertical divider between them is also down there.

My editor tells me there are 57 errors and 5 warnings in the code, by the way.

Rob

[mouthtrick2009]

Not sure if this will help, but...

(OS X v10.6.2, most recent browser versions all around)

In Safari and Opera the problem seems to be as you describe it, with just the last link, Archives, being down just at the top of the orange box containing Search. But in Firefox, both Archives and Crew Items are below the others, though not as far down as the other browsers show, and the thin dark gray vertical divider between them is also down there.

My editor tells me there are 57 errors and 5 warnings in the code, by the way.

Rob

what editor are you using that tells you that? I didn't write the code - it was a template. Will rem'd out lines give you errors?

[rstevenson]

I checked the code in BBEdit; it uses a built-in but standard validator. The page can also be checked at w3.org on its validators.

One problem... you have <br> tags in the code. For XHTML they should all be of the form <br />.

Another... you have a very odd thing happening in the header link code. It's the usual <ul> <li> form, except that there are a bunch of nbsp in between each <li> set. I've never seen that before, and it is surely not necessary, as all such spacing can be done in the stylesheet. (But that's TM for ya.)

Finally, you have the CSS Buttons stylesheet being loaded, but the classes assigned to the problematic set of links mean that CSS Buttons is not being used for them. But there may be some interaction anyway, since CSS Buttons can get involved in the styling of all link elements, I think. But maybe not -- when I try disabling the CSS Buttons stylesheet (using the Developer Tools) nothing changes.

Rob