Hi Susan,
Thank you soooo much. Wow, what a nifty way of getting this menu to work. The tutorial you setup (
http://loripsum.co.uk/separated-menu.html ) was so well documented that I was up and running with my menu in no time. I was far from getting it figured out but have spent some time figuring out what you have done and I’m now even more committed than ever in learning how to use MODx for all my future sites. I feel MODx is on a whole new level when compared to the applications I messed with and was discouraged with last year. (ie Joomla)
Please take a glimpse at
http://www.haztufiesta.com/ampi-58.html if you have minute or so. The menu is all setup with the exception of the child menu headings. I attempted correction by adjusting the innerTpl:
from <a [+wf.classes+] href="[+wf.link+]">[+wf.title+]</a>
to <li href="[+wf.link+]" [+wf.classes+]>[+wf.title+]</li> and also to <li><a href="[+wf.link+]" [+wf.classes+]>[+wf.title+]</a></li> in an attempt to fine tune it exactly.
Didn’t work
I dropped in your modified .css along with the current present .css (for a few static pages I may drop in the site.)
So that it now looks like this:
editing this particular line ( #leftnav ul li { text-align: left; margin: 0 0 0 0; font: normal 1.1em Verdana, Arial, sans;
border-top: 1px solid #444; } ) from the .css that was already there.
#leftnav ul { margin: 0 0 10px 0; padding: 0; border: 0; list-style: none; }
#leftnav ul li { text-align: left; margin: 0 0 0 0; font: normal 1.1em Verdana, Arial, sans; }
#leftnav ul li a { width: 175px; display: block; margin: 0;color: #ccc; padding: 8px 5px 8px 10px; text-decoration: none; }
#leftnav ul li a:hover { color: #fff; background: #444; }
#leftnav .header { margin: 0 0 1px 0; color: #888; text-transform: uppercase; letter-spacing: 0.2em; border-top: 0; padding:12px 5px 12px 10px; font: normal 1.1em Arial, Helvetica, sans; }
#leftnav .header a { width: 175px; display: block; color: #888; margin: 0; border-top: 0; padding:0; }
#leftnav .header a:hover { color: #ccc; background: none; }
/* MODx menu */
#leftnav {
background: #222222;
padding: 10px;
margin: 20px 0;
border: none;
width: 210px;
overflow: hidden;
}
#leftnav a {
width: 175px;
display: block;
color: #bcbcbc;
margin: 0;
border: 0;
padding: 6px 5px 6px 10px;
border-top: 1px solid #444;
}
#leftnav a:hover {
color: #fff;
background: #444;
}
#leftnav h3 {
width: 175px;
margin: 15px 0 8px 0;
color: #888;
text-transform: uppercase;
letter-spacing: 0.2em;
padding: 6px 5px 6px 10px;
font: normal 1.1em Arial,
Helvetica, sans;
line-height: 1.1em;
height: 1.1em;
}
#leftnav h3.first {
margin-top: 0;
}
#leftnav h3 a {
width: 175px;
display: block;
color: #888;
margin: 0;
border-top: 0;
padding:0;
}
#leftnav h3 a:hover {
color: #ccc;
background: none;
}
Am I missing something?