Need Help with Vertical Menu

[jkessler]

1) Script Title:
AnyLink CSS Vertical Menu

2) Script URL (on DD):
http://www.dynamicdrive.com/dynamici...nylinkcss2.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 but I would like it to open BESIDE the menu so it doesn't block the text (click on 'web design' link, once you've gone to the URL above, to see what I mean)…

Below 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;
}

[boogyman]

try

div.anylinkcss {
position: relative;
left: 10px;
visibility: hidden;
line-height: 18pt;
z-index: 100;
background-color: #ffffff;
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;
}

[jkessler]

nope, that adds space between my main menu and does nothing to the submenu placement...

(

[boogyman]

okay then you are trying to edit the position of the main menu not the sub menu...

<li onMouseover="dropdownmenu(this, event, 'anylinkmenu2')"><a href="http://www.dynamicdrive.com/style/" onClick="return clickreturnvalue()">CSS Examples</a> <span style="position: relative; left: 25px; font-family: Times New Roman">►</span></li>

that is the code to create the hover out and the drop out is listed as

<div id="anylinkmenu2" class="anylinkcss" style="width: 160px; background-color: lightyellow">

<a href="http://www.dynamicdrive.com/style/csslibrary/category/C1/">Vertical CSS Menus</a>
<a href="http://www.dynamicdrive.com/style/csslibrary/category/C2/">Vertical CSS Menus</a>
<a href="http://www.dynamicdrive.com/style/csslibrary/category/C4/">Image CSS</a>
<a href="http://www.dynamicdrive.com/style/csslibrary/category/C6/">Form CSS</a>
<a href="http://www.dynamicdrive.com/style/csslibrary/category/C5/">DIVs and containers</a>

</div>

so you need to find your drop out and change around the identifiers.. you will then be able to position it where you want.