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
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