Aloha,

Have several issues I'm dealing with but would like to start with this guy: My dropline menu is not allowing the mouse to move to the 2nd line to make selection. Tried a few hours of adjustments but so far no luck. Mahalo.

 

page sample

 

#dropline {

/* list id - style the whole thing here*/[font="

padding: 0px;/* 20px how tight the two lines junto*/

list-style: none;

background: url('/images/nav_buttons/trans.gif');

text-align: center;

margin: 0px auto; /* 0 auto = center position*/

font-size: 14px;

font-family: arial, sans-serif;

height: 21px; /* 41px*/

width: 875px; /* 800px*/

position:relative; /* had it as left:100px;*/;

top: -15px; /* -120px how far the dropline sits below buttons */

}

#dropline div {

/* position of dropline text*/

padding: 5px 0px 0px 70px; /* 5 0 0 70 centers dropline tect horz*/

margin: auto 15px auto;

list-style: none;

position: absolute;

left: -9999px; /* -9999px*/

width: 800px; /* 820px*/

text-align: center; /* left*/

background: url('/images/nav_buttons/trans.gif'); /* url(trans.gif*/

}

#dropline table {

border-collapse:collapse;

font-size:1em; /* 1em*/

float:left; /* left*/

margin:-1px; /* -1px*/

width:auto; } /* -1px*/

 

#dropline ul li { /* vertical space between dropline */

display:inline; /* inline*/

margin:0px 0px 0px 0px; /* 0000*/

text-align:center} /* dropline position */

 

/* all horiz linked menu text */

#dropline ul li a {

display:inline-block; /* inline-block*/

height:23px; /* 23px*/

line-height:30px; /* 30px*/

margin:0; /* 0 space between dropline words*/

padding: 0 5px; /* -50 55*/

background:transparent; /* transparent*/

font-weight:bold;

font-size:14px;}

 

#dropline li {

display:inline;

margin:0 -2px; /* 0, -2 space between buttons,replace color:= 8B0000 */

text-align:right;}/* right color and position of text on a buttons and dropline */

 

#dropline li a{

display:inline-block;

height:36px; /* 36*/

margin:5px -6px 0 0; /* 5 000*/

padding:0px 20px 0 0; /* 0 15 0 0*/

background:url(/images/nav_buttons/topnoarrow.gif) right top;

line-height:30px; /* 30px*/

text-decoration:none;

color:#8B0000; /* 8B0000*/

cursor: pointer; }

/* horz width of buttons */

 

#dropline li a.sub {background:url(/images/nav_buttons/toparrow.gif) right top;}

html> /* right top button position */

 

body #dropline li {

margin: 0px; /* 0*/

display: inline-block;

padding: 0px; /* 0*/

 

}

 

* html #dropline li a {margin-bottom:-4px; margin:3px;} /* -4px 3px*/

 

#dropline li a b {display:block; height:36px; float:left; padding:0 0 0 25px;

background:url(/images/nav_buttons/topnoarrow.gif) left top; }

 

#dropline li a:hover {/* hover button text */

/* replace color:= fff */

background-position: right bottom;

 

}

#dropline li a:hover b {

/* color:= hover button text */ /* replace color:= DC143C */

background-position: right bottom;

 

}

/* replace color:= fff, position of hover text */

#dropline li:hover > a {background-position:right bottom;}

 

#dropline li:hover > a b {background-position:left bottom;}/* moves arrow spacing */

 

#dropline :hover div {

left: -40px;

top: 41px; /* top 41px*/

text-align: center; /* center*/

[/font]

I've also found that sometimes a space between the top level and ther drop down levels means that the mouse loses contact when moving across the space.

 

First of all, delete all top and bottom padding, margins and borders and change the line-height to 1.0. The menu will look ugly but check if it works. (You've got line-height: 30px!!!!)

 

You also have top: -15px which I suppose you think will drag the element up over another, make this 0 too temporarily.

 

Then edit line-height, padding, margins and borders, checking after each edit.

I've also found that sometimes a space between the top level and ther drop down levels means that the mouse loses contact when moving across the space.

 

First of all, delete all top and bottom padding, margins and borders and change the line-height to 1.0. The menu will look ugly but check if it works. (You've got line-height: 30px!!!!)

 

You also have top: -15px which I suppose you think will drag the element up over another, make this 0 too temporarily.

 

Then edit line-height, padding, margins and borders, checking after each edit.

Thank you for your advice, not understanding though. Which area were you referring to specifically? Mahalo, Nyna