Sent by TMH Design on 30 October 2004 01:01
Hello, I found a tutorial on make a navigation bar out of a list. The list
is such that it has some nice nested sub list dropdowns that work great. The
issue I am having is that the styling properties are applied to ALL list in
the site, whereas they should only apply to the navigation. I have tried to
change that, but with no success. So, I'm left with trying to style other
list in the site individually. Anyway, what is happening, is I want to have
a list on a page, and in that list, I want various list items to have nested
list underneath. Everytime I try to do this, the nested list are hidden.
I've tried variations of styling on these nested list but I can't seem to
over ride the overall site styles. Here is the code for the navigation,
perhaps someone can give me the code to use for other list elsewhere in the
site:
ul {
list-style: none;
padding: 0;
margin: 0;
}
#nav a {
font-weight: bold;
color: #fff;
text-decoration:none;
font-size:12px;
padding:0 1px;
}
#nav li li a {
display: block;
font-size:10px;
color: #fff;
padding: 0 3px;
}
#nav li li a:hover {
border: 0px none;
padding-left:3px;
padding-right:3px;
text-decoration:underline;
}
li {
float: left;
position: relative;
padding:3px 8px;
text-align: center;
}
li#first {
border-left-width: 0;
padding-left:10px;
}
li#last {
border-right-width: 0;
padding-right:10px;
}
li ul {
display: none;
position: absolute;
top: 101%;
left: 0;
background-color: #3A4F6A;
}
li>ul {
top: auto;
left: auto;
}
li li {
float: none;
background-color: #3A4F6A;
border: 1px solid #3A4F6A;
margin:0;
padding:0;
}
li:hover ul, li.over ul {
display: block;
margin:0;
padding:0;
}
______________________________________________________________________
css-discuss [EMAIL-REMOVED]]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/