CSS & DIV rollover problems

admin

Administrator
Staff member
Hello All

This problem has been killing me all day.
I have a horizontal nav set up, each button has a CSS Rollover ( trifecta button). Each button has diplay set to inline to get them all in line (surprise, surprise).
Thats all well and good, but the rollovers don't "rollover" unless diplay is set to everything else but "inline".
Is this a probrem people have encountered before?
My browser is IE6.

Here is some code to look at-

.cssnav {
position: relative;
font-family: arial, helvetica, sans-serif;
background-image: url(../images/t_menu_roll_27.jpg);
background-repeat: no-repeat;
white-space: nowrap;
display : inline; <--- the problem is here
width: 90px;
height: 0px;
margin: 0;
padding: 0;
color: #0A096F
}

.cssnav a {
color: black;
font-size: 10px;
width: 90px;
height: 0px;
float: left;
color: black;
text-decoration: none;
position: relative;
font-weight:bold;
left: auto;
top: auto;
}

.cssnav img {width: 90px; border: 0;}
* html a:hover {visibility:visible}
.cssnav a:hover img{visibility:hidden}

.cssnav span {
position: absolute;
left: 16px;
top: 4px;
margin: 0px;
padding-left: 5px;
cursor: pointer;
}

Cheers

Spizhave a look here (<!-- m --><a class="postlink" href="http://www.csstips.com/css-menus/vertical.asp">http://www.csstips.com/css-menus/vertical.asp</a><!-- m -->)

that guy has vertical and horizontal CSS menus...

John
 
Back
Top