CSS Dropdown menu for the header- With Categories!

[hitch]

Folks wanting assistance with IE7 mod related issues, please post your URL's ;-)

Woody

here's mine as on my origonal post

http://www.musicservices.co.nz/killer

Like i say it happens only on IE7 but seems to be happening on every site i find with the mod.

:-) thanks for any help.

[TMontana]

Hes right.. quite hard to find (and only in iE7), but I see it on my localhost as well...

[Stenrique]

I noticed an extra, empty menu item on the right side of the menubar next to "Shopping Cart". It can also be seen at Jade's example site here. Can anyone show me how to remove that? The empty menu item is skewing the entire menubar to the left. TIA.

[CES]

I did notice this too. What I did was to make the bar background the same as the level 1 background in the css:

#dropMenuWrapper

&

div#dropMenu ul.level1

I did it with an image but I guess you can do it with normal colours.

I'm no programmer but it seemed to do the trick. You can see it on my test site:

http://www.nichelocks.com/demo

Craig

[jettrue]

I noticed an extra, empty menu item on the right side of the menubar next to "Shopping Cart". It can also be seen at Jade's example site here. Can anyone show me how to remove that? The empty menu item is skewing the entire menubar to the left. TIA.

Technically its not an empty menu item... its just leftover space. For some reason I can't remember, I liked having the menu left justified and not centered. Also, every item has a 1px white bar to the right of it in the css, so that's what that last white strip is.

But you can increase the padding a bit on this section in the stylesheet_header_menu.css

div#dropMenu li a {display: block; padding: .6em 2em .6em 2em;text-decoration: none; text-transform:uppercase; color:#ffffff; text-align:center; border-right:1px solid #ffffff;}

(adjust the 2em's, maybe to about 2.6em?)

But now I remember, you don't want to go to close to the edge, because different browsers will have slightly different spacing, and it may cause the menu to take up two lines without you realizing it.

If you want to keep the white lines between every other item, but want to take it off of the last item, you can do is open up includes/templates/common/tpl_drop_menu.php

and change:

<li><a href="<?php echo zen_href_link(FILENAME_SHOPPING_CART, '', 'NONSSL'); ?>"><?php echo HEADER_TITLE_CART_CONTENTS; ?></a></li>

to:

<li><a class="noLine" href="<?php echo zen_href_link(FILENAME_SHOPPING_CART, '', 'NONSSL'); ?>"><?php echo HEADER_TITLE_CART_CONTENTS; ?></a></li>


then add this to your stylesheet_header_menu.css:

div#dropMenu li a.noLine {border:none;}

[CES]

Very elegant jettrue.

I've made the adjustments you suggest but altered it so that I get the lines on the left and put an extra line on the right:

www.nichelocks.com/demo

Craig

[Stenrique]

Thanks for the advices Jade and Craig, I have changed spacing from 2em to 2.6em as well as adding a vertical line on the left of the "Home" menu.

Since I have very few categories and sub-categories, I am not too worried about centering the menu. Anyway I can do that? TIA.

[TMontana]

Gday.
I experience another problem regarding the dropdown Menu in IE7 (btw: any updates on the hoverover, subcategory problem in IE7?), when you hover over the main categories they colorize. The active button then seems to be about 1 px bigger (to the bottom) than the rest of the menu. Anyone else experiencing these problems?

Comments? Workarounds?

Thx for support.

T.

ps: not in Firefox, but in IE7

[jettrue]

Gday.
I experience another problem regarding the dropdown Menu in IE7 (btw: any updates on the hoverover, subcategory problem in IE7?), when you hover over the main categories they colorize. The active button then seems to be about 1 px bigger (to the bottom) than the rest of the menu. Anyone else experiencing these problems?

Comments? Workarounds?

Thx for support.

T.

ps: not in Firefox, but in IE7

Its just an issue with very slight differences in padding in IE vs Firefox. Does it cause any significant issues for you? From what I see its so slight to be barely noticeable.

[TMontana]

Hey Jettrue,

thx for answering.

Lets say it that way: if its an easy fix or some slight adjustment of the code I will be happy to make the changes ( being a stupid perfectionist ;) )
If it needs a complete rewrite of code or some major changes I will definitly not swap this magnificent mod for just that 1 px.

So if you can easily help, please do :)


Greetings.

T.