...

View Full Version : Rollover effect with a javascript submenu



jpalazzi
10-25-2004, 11:32 PM
I am having trouble getting the widths to work right. I got this code off the site and I am not sure what all it does. There are about 4 or 5 places that you can adjust the width. Can some one check out the CSS below and let me know what all it does.



body
{
margin:50px;
background-color:#ffffff;
font:13px Arial;
}

#nav, #nav ul
{
padding: 0;
margin: 0;
list-style: none;
position: absolute;
}

/* now lets get rid of position:relative for IE */

* #nav, * #nav ul
{
padding: 0;
margin: 0;
list-style: none;
}


#nav a
{
width: 82px;
display: block;
color: black;
text-decoration: none;
background-color: white;
border: 1px solid #000000;
padding: 5px;
font:12px verdana bold; /* N6 needs this to cascasde the font style */
background:url(menubg.jpg) no-repeat 0px 0px;
text-align: center;

}

/* BMH for IE 5 */

* html #nav a
{
width: 95px;
w\idth: 95px;
}

#nav li
{
float: left;
width: 90px; /* width of the individual bars */
position: relative;

}

#nav li ul
{
position: absolute;
left: -999em;
width: 95px;

}

#nav li a:hover
{
color: #FFFFFF;
background-color: #B40820;
background:url(menubg.jpg) no-repeat 0px -40px;

}

#nav li:hover ul, #nav li.sfhover ul
{
left: auto ;
}

#nav ul
{
text-align: center;
display: block;
}


Here is the site (Test Menu (http://www.arcathsch.org/hsl/test1.htm)) it is on currently. I want to make that all one line as well as have it centered any ideas?



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum