First of all: I'm from the Netherlands, so excuse my poor English.
Second: In the world of HTML & CSS I would consider myself a n00b. So maybe my problem is very easy to solve (I really hope so
). I've worked with Dreamweaver and try to look at the code from time to time to see if I uderstand it. I sometimes do 
I want to create a nested list for my new website, but stranded on some problems. I've used this (<!-- m --><a class="postlink" href="http://css.maxdesign.com.au/listamatic2/horizontal02.htm#">http://css.maxdesign.com.au/listamatic2 ... tal02.htm#</a><!-- m -->) code. Put the HTML in the body of my nav-page, and the CSS in my style sheet. Then I tried to make a subitem for Item Two. But when I cope-paste the Item One code, the new Subitems (I renamed them) stand there. Problem is: they won't go away, doesn't matter what Item I click or rollover.
Of course I would like to see a menu like this: when I rollover Item One, I see the Subitems of Item One. When I rollover Item Two, I see the Subitems of Item Two, etc. Does anybody know what I should do? I tried to play with the HTML code, but I just don't know enough of it to get it working.
Can anybody help?
Hope this makes sense to one of you... Thanks.If you paste the actual code you're working on in here maybe someone will be able to help.Well, the code is still the same as the original (as seen on the link in my message), because I don't know where to begine and what to do.
The original code:
HTML
<div id="navcontainer">
<ul id="navlist">
<li id="active"><a href=http://www.webdeveloper.com/forum/archive/index.php/"#" id="current">Item one</a>
<ul id="subnavlist">
<li id="subactive"><a href=http://www.webdeveloper.com/forum/archive/index.php/"#" id="subcurrent">Subitem one</a></li>
<li><a href=http://www.webdeveloper.com/forum/archive/index.php/"#">Subitem two</a></li>
<li><a href=http://www.webdeveloper.com/forum/archive/index.php/"#">Subitem three</a></li>
<li><a href=http://www.webdeveloper.com/forum/archive/index.php/"#">Subitem four</a></li>
</ul></li>
<li><a href=http://www.webdeveloper.com/forum/archive/index.php/"#">Item two</a></li>
<li><a href=http://www.webdeveloper.com/forum/archive/index.php/"#">Item three</a></li>
<li><a href=http://www.webdeveloper.com/forum/archive/index.php/"#">Item four</a></li>
</ul>
</div>
CSS
#navcontainer { }
#navcontainer a { text-decoration: none; }
#navcontainer ul
{
padding: 0;
margin: 0;
list-style-type: none;
position: relative;
}
#navcontainer li { display: inline; }
/*1st level elements*/
#navcontainer ul
{
border-top: 1px solid #36c;
border-bottom: 1px solid #36c;
background-color: #36c;
padding: 2px 0;
margin-bottom: 2em;
}
#navcontainer li { margin: 0 0 0px; }
#navcontainer ul a,
#navcontainer ul a:link,
#navcontainer ul a:visited
{
background-color: #36c;
border: 1px solid #36c;
color: white;
padding: 0px 5px;
}
#navcontainer ul a:hover,
#navcontainer ul a:focus
{
background-color: #9CD4F7;
border: 1px solid black;
color: black;
}
/*current Link*/
#navcontainer ul a#current,
#navcontainer ul a#current:link,
#navcontainer ul a#current:visited { font-weight: bold; }
/*Second and subsequent levels*/
#navcontainer ul ul
{
font-size: 80%;
position: absolute;
top: 23px;
left: 0;
width: 100%;
border-top: none;
background-color: #95B1BB;
}
#navcontainer ul ul li { display: inline; }
#navcontainer ul ul a,
#navcontainer ul ul a:link,
#navcontainer ul ul a:visited
{
background-color: #95B1BB;
border: 1px solid #95b1bb;
color: black;
}
#navcontainer ul ul a:hover,
#navcontainer ul ul a:focus
{
background-color: #9CD4F7;
border: 1px solid black;
color: black;
}
/*current Link*/
#navcontainer ul ul a#subcurrent,
#navcontainer ul ul a#subcurrent:link,
#navcontainer ul ul a#subcurrent:visited { font-weight: bold; }It sounds like you are attempting pure CSS menus (<!-- m --><a class="postlink" href="http://www.howtocreate.co.uk/tutorials/testMenu.html">http://www.howtocreate.co.uk/tutorials/testMenu.html</a><!-- m -->)I see that site's got some explanations, I'll look at them as soon as I get home. Then I hope I can decypher them and put it to use in my original code ('cause I just like the horizontal menu better)
Thanks, and I'll be sure to let you guys know if it succeded.
Greetz,
TimothyNo matter what I try (and it's not much, I gotta be fair, because I wouldn't know whé–±
Second: In the world of HTML & CSS I would consider myself a n00b. So maybe my problem is very easy to solve (I really hope so
). I've worked with Dreamweaver and try to look at the code from time to time to see if I uderstand it. I sometimes do I want to create a nested list for my new website, but stranded on some problems. I've used this (<!-- m --><a class="postlink" href="http://css.maxdesign.com.au/listamatic2/horizontal02.htm#">http://css.maxdesign.com.au/listamatic2 ... tal02.htm#</a><!-- m -->) code. Put the HTML in the body of my nav-page, and the CSS in my style sheet. Then I tried to make a subitem for Item Two. But when I cope-paste the Item One code, the new Subitems (I renamed them) stand there. Problem is: they won't go away, doesn't matter what Item I click or rollover.
Of course I would like to see a menu like this: when I rollover Item One, I see the Subitems of Item One. When I rollover Item Two, I see the Subitems of Item Two, etc. Does anybody know what I should do? I tried to play with the HTML code, but I just don't know enough of it to get it working.
Can anybody help?
Hope this makes sense to one of you... Thanks.If you paste the actual code you're working on in here maybe someone will be able to help.Well, the code is still the same as the original (as seen on the link in my message), because I don't know where to begine and what to do.
The original code:
HTML
<div id="navcontainer">
<ul id="navlist">
<li id="active"><a href=http://www.webdeveloper.com/forum/archive/index.php/"#" id="current">Item one</a>
<ul id="subnavlist">
<li id="subactive"><a href=http://www.webdeveloper.com/forum/archive/index.php/"#" id="subcurrent">Subitem one</a></li>
<li><a href=http://www.webdeveloper.com/forum/archive/index.php/"#">Subitem two</a></li>
<li><a href=http://www.webdeveloper.com/forum/archive/index.php/"#">Subitem three</a></li>
<li><a href=http://www.webdeveloper.com/forum/archive/index.php/"#">Subitem four</a></li>
</ul></li>
<li><a href=http://www.webdeveloper.com/forum/archive/index.php/"#">Item two</a></li>
<li><a href=http://www.webdeveloper.com/forum/archive/index.php/"#">Item three</a></li>
<li><a href=http://www.webdeveloper.com/forum/archive/index.php/"#">Item four</a></li>
</ul>
</div>
CSS
#navcontainer { }
#navcontainer a { text-decoration: none; }
#navcontainer ul
{
padding: 0;
margin: 0;
list-style-type: none;
position: relative;
}
#navcontainer li { display: inline; }
/*1st level elements*/
#navcontainer ul
{
border-top: 1px solid #36c;
border-bottom: 1px solid #36c;
background-color: #36c;
padding: 2px 0;
margin-bottom: 2em;
}
#navcontainer li { margin: 0 0 0px; }
#navcontainer ul a,
#navcontainer ul a:link,
#navcontainer ul a:visited
{
background-color: #36c;
border: 1px solid #36c;
color: white;
padding: 0px 5px;
}
#navcontainer ul a:hover,
#navcontainer ul a:focus
{
background-color: #9CD4F7;
border: 1px solid black;
color: black;
}
/*current Link*/
#navcontainer ul a#current,
#navcontainer ul a#current:link,
#navcontainer ul a#current:visited { font-weight: bold; }
/*Second and subsequent levels*/
#navcontainer ul ul
{
font-size: 80%;
position: absolute;
top: 23px;
left: 0;
width: 100%;
border-top: none;
background-color: #95B1BB;
}
#navcontainer ul ul li { display: inline; }
#navcontainer ul ul a,
#navcontainer ul ul a:link,
#navcontainer ul ul a:visited
{
background-color: #95B1BB;
border: 1px solid #95b1bb;
color: black;
}
#navcontainer ul ul a:hover,
#navcontainer ul ul a:focus
{
background-color: #9CD4F7;
border: 1px solid black;
color: black;
}
/*current Link*/
#navcontainer ul ul a#subcurrent,
#navcontainer ul ul a#subcurrent:link,
#navcontainer ul ul a#subcurrent:visited { font-weight: bold; }It sounds like you are attempting pure CSS menus (<!-- m --><a class="postlink" href="http://www.howtocreate.co.uk/tutorials/testMenu.html">http://www.howtocreate.co.uk/tutorials/testMenu.html</a><!-- m -->)I see that site's got some explanations, I'll look at them as soon as I get home. Then I hope I can decypher them and put it to use in my original code ('cause I just like the horizontal menu better
)Thanks, and I'll be sure to let you guys know if it succeded.
Greetz,
TimothyNo matter what I try (and it's not much, I gotta be fair, because I wouldn't know whé–±