AnyLink CSS Vertical Menu

[jkessler]

1) Script Title:
AnyLink CSS Vertical Menu

2) Script URL (on DD):
http://www.dynamicdrive.com/dynamicindex1/anylinkcss2.htm

3) Describe problem:
I would like to use this vertical menu script on my page and though I've managed to customize the fonts, spacing, etc. - how can I alter the submenu placement? Right now, it opens ontop of the menu (half on/half off actually) but I would like it to open BESIDE the menu so it doesn't block the text... i.e. if my menu is 150 pixels wide, I would like the submenu to start 150 pixels over...

Thanks

[boogyman]

div#anylinkmenu0 {
position: relative;
left: 5px;
}

where anylinkmenu0 zero is the submenu number

[jkessler]

where am i to put this code? in my HTML file or in the CSS file?

[boogyman]

that is a css style so whereever you keep the CSS Styles for the menu.

[g3000]

I'm having the exact same issue, but once I use the solution you suggest here, my dropdowns disappear. The culprit seems to be position: relative. The only way I can get the dropdowns to appear again is to use display: inline, but then the relative positioning doesn't work. :mad: Any ideas? Thanks in advance.

[jkessler]

this is the CSS file... changing the first two items (position and left) does not change the position of the submenu (i've already tried)... what am i missing here? HELP!

.anylinkcss{
position:absolute;
left:150px;
visibility: hidden;
line-height: 18pt;
z-index: 100;
background-color: white;
width: 150px;
font-family: Geneva, Arial, Helvetica, sans-serif;
font-size: 9pt;
line-height: 18pt;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-decoration: none;
left: 150px;
}

.anylinkcss a{
left:150px;
color: black;
width: 100%;
display: block;
text-indent: 3px;
border-bottom: 0px solid gray;
padding: 1px 0;
text-decoration: none;
font-weight: bold;
text-indent: 5px;
}

.anylinkcss a:hover{ /*hover background color*/
background-color: #F8FBBD;
color: black;
}