Install Error and Design Questions

John,

i just purchased the product and received this error

Got it fixed. Nevermind. I may some other questions as usual

John,

I used the horizontal hover example. I would like to use a pipe as a seperator. I have been uable to remove the last | from the menu. I thought about a custom css class for the last record read from the database, but I don't know how I can control applying the custom class to the last record. Any ideas? How do I control the positioning of the menu when I log in as host and menu shifts up about 20-25 pixels? Is this possible?  I used these classes from t the example and tweaked them a bit. I would like the color of the list items to be a different color other than black and a different color when the user hovers over the list item? I have struggled with this a bit.

#nav a {
    font-size:1.08em;
    display:block;
    text-decoration:none;
    text-align:center;
    font-weight:bold;
    width:8.5em;
    padding :2px 0 2px 0;
    color:#000;
    border:1px solid #055EAE;
    background-color:#055EAE;
}
#nav li li a {
    width:12em;
}

#nav li a:hover {
  background-color: #055EAE;
  border:1px solid #055EAE;
}
#nav li a.SelectedTab {
    font-size:1.12em;
    background-color: #055EAE;
}
#nav .DisabledTab {
    color:#ccc;
}
/* no need to change these hover classes
unless you need more than 4 levels */
#nav li:hover ul ul,
#nav li:hover ul ul ul,
#nav li:hover ul ul ul ul,
#nav li.iehover ul ul,
#nav li.iehover ul ul ul,
#nav li.iehover ul ul ul ul{
  left: -999em;
}

#nav li:hover ul,
#nav li.iehover ul {
    top: 1.6em;
    left:0;
}
#nav li li:hover ul,
#nav li li li:hover ul,
#nav li li.iehover ul, 
#nav li li li.iehover ul {
    top: 0;
    left:12.8em;
}

#navContainerBorder {
    background-color:white;
    padding:2px;
    border:1px solid #333;
    height:30em;
}
#navContainer {
   border:1px solid #333;
   background-color: #055EAE;
   height:30em;
   width:12em;
   vertical-align:top;
   padding:10px 5px 10px 5px;
}


Thx

Hi Jaime,

There should be a class assigned to that element called last-child

I have had requests for switching directly from my menu to Solpart, so what I'll do is create a template that can just be plugged in.

However, you are probably better off switching it out to use more standards compliant markup if you stay on your current course. You may want to switch to using the sucker fish template for more control over the output markup though.

I tried this by removing border-right: 1px solid #ffffff;
This does not seem to work. Is this correct?  Changing the color and hover color is tricky as well

#nav li:last-child {
position: relative;
float:left;
line-height : 1.25em;
width: 9em;
list-style: none;
}

The Snapsis CSS NavMenu defines Last-Child as a CSS class selector which should start with a period in your stylesheet.  So you would define it like this:

#nav li.Last-Child

You'll need to make sure that Class="Last-Child" is actually showing in your markup to use it as a class selector.

If you are using a template then you may need to add code to the template to get the last-child

The way you are using it is as a psuedo-class which may also work in modern browsers, but isn't as consistent across browsers.

But it may be better to define it with it's parent container like this:

#nav ul > li:last-child 

http://www.w3.org/TR/css3-selectors/#last-child-pseudo

I am not using a template. I am simply extracted the relevant information from the example style sheet and added it to my style sheet. The rendered html is not displaying class"Last-Child". How do add the class last-child so that CSSNavMenu renders it in the html? Do I have to create a template for the HorizontalHover or do I have to use the son of suckerfish example to use a template?

No it did not work since I was using the Hover type of menu and no template.....I think I will try the template example. I will let you know if and most likely when I run into problems.

I have only one level for my top menu. I took your example and used to create a template. I have only one level of tabs. Will this work?

this is the css that I am using. I have set the top level container relative and the second container, #nav ul , as absolute and top 10px. However I cant get the tab items to line up the same way the solpart menu lines up. Any suggestions? I cant begin to tell you how frustrating this is getting.

/* CSS Document */

/* NavMenu styles start here */

#navHContainer {
position:relative;
display:block;
width:900px;
font-family: Verdana, Arial;
}
#nav ul {
position: absolute;
top: 10px;
padding:0;
margin:0;
list-style:none;
width:auto;
}

#nav li {
float: left;
line-height : 1.25em;
width: 9em;
border-right: 1px solid #ffffff;
list-style: none;
}

#nav li ul { /* second-level lists */
position : absolute;
left: -999em;
width:13em;
}


#nav a {
font-size:1.10em;
display:block;
text-decoration:none;
text-align:center;
font-weight:bold;
width:8.5em;
padding :2px 0 2px 0;
color:#ADFCFF;
}
#nav li li a {
width:12em;
}

#nav li a:hover {
color:#FFA04C;
}
#nav li a.SelectedTab {
font-size:1.12em;
}
#nav .DisabledTab {
color:#ccc;
}
/* no need to change these hover classes
unless you need more than 4 levels */
#nav li:hover ul ul,
#nav li:hover ul ul ul,
#nav li:hover ul ul ul ul,
#nav li.iehover ul ul,
#nav li.iehover ul ul ul,
#nav li.iehover ul ul ul ul{
left: -999em;
}

#nav li:hover ul,
#nav li.iehover ul {
top: 1.6em;
left:0;
}
#nav li li:hover ul,
#nav li li li:hover ul,
#nav li li.iehover ul,
#nav li li li.iehover ul {
top: 0;
left:12.8em;
}

would you rather I send you the skin? Or can you work off the server?