Css Flyout Categories Menu troubles

O.k. clyde......got it updated and uploaded to the DEV team. I'm sure they will post it A.S.A.P.
It was updated to remove this file, and an old screenshot that was left in there. I also credited you for this crucial discovery. Update message was as follows:

Just an updat to remove the file "template_info.php" which wasn't necessary, and if used to over-write a persons' template_info.php in their custom template, would cause them to loose their template info under Admin>tools>template selection!
Many thanks to clydejones for pointing out this crucial flaw!

Oops. Just noticed that I misspelled "update", right off the bat. Man.......I've got to slow down a little bit. Too many little, but stupid mistakes!

Thanks, again, clyde.

Get Em Fast

I do have one question about the mod. I have to admit, I don't use it myself, but I'd like to become familiar with it in case I get more requests to install it.

Is it my imagination or is there a problem getting everything to fit nicely into the category sidebox. I've looked at a couple of different sites that use it and noticed that the bottom seems to run directly into the following sidebox (overlapping the header portion of the box)

Uh....so far, I haven't noticed this, but in some cases you might be right. I've attached a screen shot of the original mod where I developed it. If you have any problems, just let me know. I'm sure it's just a margin or padding issue.

Get Em Fast:

Uh....so far, I haven't noticed this, but in some cases you might be right. I've attached a screen shot of the original mod where I developed it. If you have any problems, just let me know. I'm sure it's just a margin or padding issue.

Thanks, I'll play around with it a bit.

clydejones:

Thanks, I'll play around with it a bit.

Sorry. Had to leave for a bit.
This was just as easy as I thought it would be. Just find these two sections (first part of code):

div#nav-cat {width: 150px; margin: -1px 0 0 -1px;
background-color: transparent; font-weight:bold;
text-align: center;
line-height: 23px;
}

and.....

div#nav-cat ul {margin: 0; padding: 0; padding-top: 0; width: 150px; background-color: transparent;
border: 2px solid tan;
background-repeat: no-repeat;
}

And add:

padding-bottom: 1em;

to each on of them, with the results being:

div#nav-cat {width: 150px; margin: -1px 0 0 -1px;
background-color: transparent; font-weight:bold;
text-align: center;
line-height: 23px;
padding-bottom: 1em;
}

div#nav-cat ul {margin: 0; padding: 0; padding-top: 0; width: 150px; background-color: transparent;
border: 2px solid tan;
background-repeat: no-repeat;
padding-bottom: 1em;
}

Hope this helps.

Hello, I would turn it on there but it is not showing up there as it would if the database could find the files. Do I keep all of files together and I any tips would be greatly appreciated. Every little bit helps. Thank you I have been working on this for three days and I am not going anywhere with it.

I thank all of you for your help and patience. I am still learning as this is a new process for me. Have a great day!

Get Em Fast:

Sorry. Had to leave for a bit.
This was just as easy as I thought it would be. Just find these two sections (first part of code):

div#nav-cat {width: 150px; margin: -1px 0 0 -1px;
background-color: transparent; font-weight:bold;
text-align: center;
line-height: 23px;
}

and.....

div#nav-cat ul {margin: 0; padding: 0; padding-top: 0; width: 150px; background-color: transparent;
border: 2px solid tan;
background-repeat: no-repeat;
}

And add:

padding-bottom: 1em;

to each on of them, with the results being:

div#nav-cat {width: 150px; margin: -1px 0 0 -1px;
background-color: transparent; font-weight:bold;
text-align: center;
line-height: 23px;
padding-bottom: 1em;
}

div#nav-cat ul {margin: 0; padding: 0; padding-top: 0; width: 150px; background-color: transparent;
border: 2px solid tan;
background-repeat: no-repeat;
padding-bottom: 1em;
}

Hope this helps.

Thanks, I also noticed that the contribution I was working with used a "float:left"
declaration which I removed and everything works fine.

Hmmm.........You sure it was my version? I have no float at all in mine.
Here is the FULL code, just in case you would like to compare:

body {
behavior: url(./csshover.htc);
/* WinIE behavior call */}

div#nav-cat {width: 150px; margin: -1px 0 0 -1px;
background-color: transparent; font-weight:bold;
text-align: center;
line-height: 23px;
padding-bottom: 1em;
}
div#nav-cat ul {margin: 0; padding: 0; padding-top: 0; width: 150px; background-color: transparent;
border: 2px solid tan;
background-repeat: no-repeat;
padding-bottom: 1em;
}

div#nav-cat ul.level2 {margin: 10; padding: 2; width: 150px;
background-color: transparent;
border: none;
}
div#nav-cat ul.level2 {background-color: transparent;
}
div#nav-cat ul.level3 {background-color: transparent;
}
div#nav-cat ul.level4 {background-color: transparent;
}
div#nav-cat ul.level5 {background-color: transparent;
}
div#nav-cat ul.level6 {background-color: transparent;
}
div#nav-cat li {background-image: url(../images/b1.gif);
position: relative;
list-style: none;
margin: -2px;
margin-top: 6px;
z-index: 20;
height: 23px;
width: 150px;
/* change it to whatever space you want to put space between buttons*/}
/* <---this line may help or hinder IE menu shifting issues /
div#nav-cat li li {
margin: 10px;
/ this overrides the margin-top in the declaration above */
}
div#nav-cat li:hover {background-image: url(../images/b1_over.gif);
}
div#nav-cat li.submenu {

background-color: transparent;

}
div#nav-cat li.submenu:hover {background-color: transparent;

}

div#nav-cat ul {background-color: transparent;
}
div#nav-cat li a {display: block; padding: 0.25em 0 0.25em 0.5em;
text-decoration: none; width: 150px;}
/border-left: 0.5em solid #BBB;}
div#nav li a:hover {border-left-color: red;}/
}
div#nav li a:hover {border: none;
}
div#nav-cat>ul a {width: 150px;
}
div#nav-cat ul ul {position: absolute; top: 0; left: 152px;
display: none;
}
div#nav-cat ul.level1 li.submenu:hover ul.level2,
div#nav-cat ul.level2 li.submenu:hover ul.level3,
div#nav-cat ul.level3 li.submenu:hover ul.level4,
div#nav-cat ul.level4 li.submenu:hover ul.level5,
div#nav-cat ul.level5 li.submenu:hover ul.level6 {display:block;
}

jben, check your pm's when you log back in, o.k.?

Get Em Fast:

Hmmm.........You sure it was my version? I have no float at all in mine.
Here is the FULL code, just in case you would like to compare:

Not your verison, it was the version before yours.

clydejones:

Not your verison, it was the version before yours.
Ahhh..... I knew there wasn't a "float" in it, after I got done with the modifications.

Get Em Fast:

Ahhh..... I knew there wasn't a "float" in it, after I got done with the modifications.

Well it working fine and I shouldn't have any problems in the future.

Hi Get Him Fast and Clyde

Thank you both, for the info Get Him and Clyde for the help

Last think I need on this mod ( or my mod ) is how can I make large space or even an Empty box between my category list to the Special., New Product Etc...
Or maybe I shouldn’t say last think, there is always something new coming up :smile:

motti:

Hi Get Him Fast and Clyde

Thank you both, for the info Get Him and Clyde for the help

Last think I need on this mod ( or my mod ) is how can I make large space or even an Empty box between my category list to the Special., New Product Etc...
Or maybe I shouldn’t say last think, there is always something new coming up :smile:

in stylesheet_categories_menu.css add the following:

#spacing {
padding: 0.2em 0;
border: 3px solid #fff;
}

Now in tpl_categories_css.php find this line of code:

    $content .= '<ul class="level1"><li><a href=""> </a></li></ul>';  // insert a blank line/box in the menu

and change it to read:

  $content .= '<div id="spacing"> </div>';  // insert a blank line/box in the menu

Ty Clyde

It is looking great :clap:

You are the best

Thank you

hi
does somebody can help me in solving this problem:
I have a site with two languages, I want to have some categories for a language but not for the others, the problem is that category flyout shows a blank row for this not translated category, any idea to resolving this problem?
the same problem I have in another site with multisite module, normal category sidebox works with filter function of multisite module, but flyout doesn't work and shows all categories eben filtered categories.
2- I got already the solution to get subcategories from right to left from Dr.Byte, but for the header css flyout, I don't find any place to change float, or etc, every changes I ried didn't work, any idea about this too?

thanks iin advance
reza

reza, could you post a URL so we can see this, please? I think I know what you are trying to do, but I want to make sure.

I have just implemented this fantastic mod. It is great in IE. Bear in mind that this could be specific to me, but in Firefox, the side menu is dark blue - it doesn'thave the image rollovers. It looks like it is CSS styled.

http://www.thegemtree.com/

appreciate any help with this.

**** SORRY IGNORE THAT, I CANNOT EDIT AND REMOVE THE ABOVE ****
it is working fine in firefox. For some reason, firefox was not showing it right for a little while

HeathenMagic:

I have just implemented this fantastic mod. It is great in IE. Bear in mind that this could be specific to me, but in Firefox, the side menu is dark blue - it doesn'thave the image rollovers. It looks like it is CSS styled.

http://www.thegemtree.com/

appreciate any help with this.

HeathenMagic:

**** SORRY IGNORE THAT, I CANNOT EDIT AND REMOVE THE ABOVE ****
it is working fine in firefox. For some reason, firefox was not showing it right for a little while

Thanks for the compliment. Just thought the colors were a little off for your site. Of course, you can replace those 2 images with any you like.......or if you like those buttons, and not the colors.....guess what?......I made you some that matches your site a little better. You might have to change the color of your text, though. Anyway, here they are: