CSS Dropdown menu for the header- With Categories!

[Chriswww]

A big thanks from me for your contribution here jettrue.

I've got the menus roughly how I want them over at tupshup.com however, I cannot seem to align the menu text without knocking the fields out. For example I've tried:


div#dropMenu ul ul li {
border: 1px solid #696537;
/*border-left:1px solid #000000; */
width:99.4%;z-index:1000;
padding-top: 1em;
}

But then in some of the sub menus the padded area is unhoverable. Any ideas? Forgive me but I'm still new to this so it'll no doubt be something simple.

[Chriswww]

I've also tried various other commands in css such as text-align but it just knocks the field out along with the text.

[sam_m]

I apologise if this has been covered, but I havent found anything of yet, isit possible to have each category on the menu to have a different width, for example... If I had

Home : About Us : Questions and Answers : Gallery : Contact us

At the moment the spacing for each category on the menu is exactly to whatever ive set the % in the CSS, but the questions and answers is too long and drops down a line making it look untidy. Instead of having the same width for each category no matter how long the description is, can I set a margin for each Category listed? So basically it would be the gap/margin between each category which I need to define rather than the actual box its in.

Hope that makes sense
Kind Regards
Sam

Just added an image of what I mean to make it clearer, I want to get the layout similar to the top, but because of the same width of category box, im getting the drop down....

[jettrue]

I apologise if this has been covered, but I havent found anything of yet, isit possible to have each category on the menu to have a different width, for example... If I had

Home : About Us : Questions and Answers : Gallery : Contact us

At the moment the spacing for each category on the menu is exactly to whatever ive set the % in the CSS, but the questions and answers is too long and drops down a line making it look untidy. Instead of having the same width for each category no matter how long the description is, can I set a margin for each Category listed? So basically it would be the gap/margin between each category which I need to define rather than the actual box its in.

Hope that makes sense
Kind Regards
Sam

Just added an image of what I mean to make it clearer, I want to get the layout similar to the top, but because of the same width of category box, im getting the drop down....

You can do this by removing the width percentages, and instead try messing with the left and right padding that looks like this:

padding: .6em 0;

(The 0 is the current left and right padding, the .6em is for the top and bottom padding)

[DBB1]

Hello JetTrue...

Just a brief question about security settings and your contribution (which I love, by the way).

When I posed the question, one of the ZenCart gurus said that - for the entire site - I should set ALL folder permissions to 755, and ALL file permissions to 644.

I assume I would use my host's file manager tool to do this recursively from the top-most site folder, but before doing so, I thought it would be prudent to ask the authors of the contributions I'm using how this would affect their mods.

So, would performing such an activity have an adverse effect on the CSS Flyout menus?

Thanks,
-DBB1

[jettrue]

Hello JetTrue...

Just a brief question about security settings and your contribution (which I love, by the way).

When I posed the question, one of the ZenCart gurus said that - for the entire site - I should set ALL folder permissions to 755, and ALL file permissions to 644.

I assume I would use my host's file manager tool to do this recursively from the top-most site folder, but before doing so, I thought it would be prudent to ask the authors of the contributions I'm using how this would affect their mods.

So, would performing such an activity have an adverse effect on the CSS Flyout menus?

Thanks,
-DBB1

I have no idea, sorry!

[yelow]

Hey jettrue, I've another question for you.

I've been breaking my head trying to figure out who wrote that flyout menu addon, and I kept searching flyout and getting another one.

Now, my memory has finally come back to me, I remember reading this thread when I was configuring the menu.

I've moved servers, and it doesn't work as-is. I always expect things to break, so the old site is still running, I haven't switched the DNS over yet.

The new static address is 77.68.43.14 and as you can see, the menu is not working.

I am hoping that you can take one look at it and go "Oh! Of course, that's just the #### that needs to be #####."

Otherwise, I'm looking at remodifying the classic template into http://store.persite.com - most of which I cannot remember how I did.

So yea, lemme know if you know what's the issue. It definitely only seems to happen if I put the header_tpl files into place.

-Tim

[jettrue]

Hey jettrue, I've another question for you.

I've been breaking my head trying to figure out who wrote that flyout menu addon, and I kept searching flyout and getting another one.

Now, my memory has finally come back to me, I remember reading this thread when I was configuring the menu.

I've moved servers, and it doesn't work as-is. I always expect things to break, so the old site is still running, I haven't switched the DNS over yet.

The new static address is 77.68.43.14 and as you can see, the menu is not working.

I am hoping that you can take one look at it and go "Oh! Of course, that's just the #### that needs to be #####."

Otherwise, I'm looking at remodifying the classic template into http://store.persite.com - most of which I cannot remember how I did.

So yea, lemme know if you know what's the issue. It definitely only seems to happen if I put the header_tpl files into place.

-Tim

It's working for me in Camino and Firefox. Where is it not working for you? If its only in IE6, did you follow the .htaccess instructions?

[jettrue]

A big thanks from me for your contribution here jettrue.

I've got the menus roughly how I want them over at tupshup.com however, I cannot seem to align the menu text without knocking the fields out. For example I've tried:


div#dropMenu ul ul li {
border: 1px solid #696537;
/*border-left:1px solid #000000; */
width:99.4%;z-index:1000;
padding-top: 1em;
}

But then in some of the sub menus the padded area is unhoverable. Any ideas? Forgive me but I'm still new to this so it'll no doubt be something simple.

What do you mean, align them? Align them with what? The menu looks fine to me.

[Chriswww]

Vertical text alignment in sub menus, checkout the screen shot:



My cursor is hovering over the highlighted menu, believe it or not :)