I am updating a site and want to use CSS navigation menus. I have been frustrated in that the CC HTML Editor will only show the main menu items but no 'child' items. For example, if a menu item has sub items, then the item should display to the right like a drop down when the cursor is hovered over the main menu item.

It seems that the editor doesn't recognize some CSS commands because when I click on the "Test in Browser" button, it works fine in FireFox 3.0 (IE is another matter altogether!). When I hover over the main menu item in FireFox, the child items appear to the right.

I've searched the application as thoroughly as I could but haven't been able to locate anything that would correct this. Does anyone have any clues?

Greg

Is this any help?

http://www.dynamicdrive.com/style/cssli … ical/P240/

Greg,

I have found that if I want to test CSS and the page on my computer, it is best to have both in the same folder on my computer. Then after saving the CSS file, I look at preview and everything works.

If you have your CSS files in a different folder, it may not work from the editor display. This is not a limitation of the editor, but I think it is due to the differences in how your get from one directory to another on your computer vs. on a web page.

Thanks Woody, I'll check that out.

Hi Bill,

The CSS in this case is new so it's internal (or in-line?) in the HTML. I get it working then move it to an external file when I'm done.

Greg,

I also use the style section in the head of my pages, and when I have things the way I want, I save that section as an external CSS, if it will be applied to more than one page. If the styling is specific to just one page, I leave it in the head of the page.

I have never had a problem getting that CSS to work. If I find that it does not work, I generally find that I have made a mistake in my typing. I tend to have fumble fingers, so it happens more than I like to admit.

The preview should work fine as it's just IE (unless active content is being blocked, in which case you should look into adding "mark of the web" code to your page), but the visual editor can't be used for this sort of thing.

On the one hand, it doesn't support all the css you might like to use. On the other, things are where you place them with a WYSIWYG. This isn't the case with hover/popup/dropdown menus, which change position/appear/hide depending on whether they are being hovered or not.

I'm just plain confused. I've gone over this and I still can't see what the problem is.

The page is here:

http://www.olympiahighlanders.org/Working/vertmenu.html

The links don't work but the problem area is very apparent. The four tags below the "March" tag are obviously displaying wrong. Then, suddenly the CSS picks back up again.

And IE 7 just ignores the code altogether. When I hover the cursor over the links in IE, they change until I get to the "March" section, then nothing.

I'm feeling lost right now.

Greg

Greg,

What about the four tags is wrong?

What I see looks like music notation of 1/2 3/4 4/4 and 6/8 all in a row.

If it is the look, just put the CSS in for them. All your other listings look like they are defined, but these are not. For example, <li><h2>March</h2> is defined in the CSS with the h2 tag and <a href="bprtunes/BasicFive/AmazingGrace.php">Amazing Grace</a> is defined by the <a> tag using this CSS:
#menu a, #menu h2 {
font: bold 0.7em/1.4em arial, helvetica, sans-serif;
}

If you put an <h2> tag around the those entries, they should display correct.

The "March" tag is displayed correctly, it should appear similar to the "Competition" and "Basic Five ..." tags, However, the 2/4, 4/4, etc should be below the "March" tag, below each other vertically, not in a row and have the same font, not the "Times Roman" they currently appear in. As far as the background, they should be light gray as they currently appear.

What I'm finding confusing is that the "child" tags from the 2/4, 4/4, etc are correct "font-wise" i.e. Helvetica, sans serif. I can't find any reference in the CSS to "Times-Roman"; where did that come from? Is the Browser just defaulting?

Also, I still can't get the CSS to work in my C.C. HTML Editor; I have to test it in the browser to see the changes. Forget about IE, even though I attempted to "catch" it in the CSS code that appears below the main CSS.

I'm about to search the internet for an already complete CSS and just insert it. (like the one Woody sent above).

Greg