Hey all,
I have the CSS section below to style an AJAX
powered collapsible menu using an unordered list.
All is great on FireFox and Safari, but on IE6 and
IE7 there is an extra line below any top level
menu LI that has children associated with it.
The code builds the whole menu, with the LI child
items in place, but with a display=none set as
default, and then changes to display=inline when
clicked.
But when collapsed the parents show an extra thick
line on the bottom, but as I said, only on IE6 and
IE7.
Thanks!
Skip
The code...
.menu ul {
width: 100%;
margin-left:0;
padding-left:0;
}
.menu li {
list-style: none;
background-color: #9cabc4;
}
.menu li a {
display: block;
text-decoration: none;
border-bottom: 1px solid #666666;
color: #ffffff;
padding-left: 3px;
padding-top: 3px;
padding-bottom: 3px;
}
.menu li a.current {
color: #ed1d25;
font-weight: bold;
}
.menu a:hover, .menu a.child:hover {
display: block;
text-decoration: none;
border-bottom: 1px solid #666666;
background-color: #455e88;
color: #ffffff;
}
.menu li a:visited { color: #ffffff; }
.menu li a.child { background-color: #bec8d9;
}
.menu li a.home {
border-top: 1px solid #666;
}
--
Skip Evans
Big Sky Penguin, LLC
61 W Broadway
Butte, Montana 59701
406-782-2240
http://bigskypenguin.com
=-=-=-=-=-=-=-=-=-=
Check out PHPenguin, a lightweight and
versatile PHP/MySQL development framework.
http://phpenguin.bigskypenguin.com/
______________________________________________________________________
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
