Horizontal navigation displays as vertical in ie6

3/12/2009 9:51 pm | #1 jules.webb286095

Hello

I am using the CSS Menu Writer to create a horizontal menu. It displays correctly in everything but ie6. In ie6 it displays as a block item, not inline.

I'm using the following doctype:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en">

I have confirmed that the mapping to the conditional menu_ie.css file is correct.

If you wish to view it online go to: akacupuncture.webbdemo.com/
un: webassit
pw: guest

To see a page stripped of everything but the basic header info go to: test.php

I appreciate any new leads someone has to offer.

Cheers!

Jules

3/13/2009 7:35 am | #2 Ray BorduinWebAssist

The path seems incorrect. I view source and see:



when it should be:

Did this help? Tips are appreciated...

3/13/2009 1:24 pm | #3 jules.webb286095

Hi Ray

I know the direct path from the root level shouldn't contain the ../ ---but since the page is a template I created in Dreamwearver CS3 it adds that to the path, appropriately so from the template folder, but it remains on the files created from the template. The path does work, I just double checked it again by adding a dispaly inline to ul#cssmw ul which makes the child links show inline instead of block.

If you want to see a page without the ../ go to: test.php
It isn't connected to any template and the link used is href="aa_css/global_ie6.css" ----the results are the same.

Do you have any other ideas?

Thanks for your time!

Jules

3/13/2009 2:33 pm | #4 Ray BorduinWebAssist

The problem is that DW won't update the path on the individual pages properly since the link is technically inside of a comment.

You will have to move this into an editable region and update the path on the child pages... the path may be right on the template, but not on the resulting page DW creates from that template.

Did this help? Tips are appreciated...

3/14/2009 7:18 am | #6 Ray BorduinWebAssist

Looks like one more bad path... i believe:

<script type="text/javascript" src="../CSSMenuWriter/cssmw/menu.js"></script>

should be:

<script type="text/javascript" src="CSSMenuWriter/cssmw/menu.js"></script>

Did this help? Tips are appreciated...

3/14/2009 10:24 am | #7 carl_2005_65183847

Hi Jules

I cannot see your site as it says i need a login, but i just thought it might be of help that if your horizontal navigation is showing vertical in ie6 it might happen if you have a auto width property.

I had this problem a while ago and it is ie6 that does not process the ie6 property correctly.

Hope this helps

Carl

3/14/2009 2:34 pm | #8 jules.webb286095

Hello Carl

The login info was included in my first post if you would still like to take a look. The only auto width I found in the menu.css file was: ul#cssmw > li > span > a

I did try commenting it out, and using a pixel width in the menu.css file and the ie conditional file, but no luck so far. Thanks for taking the time:-)

Jules

3/16/2009 5:28 pm | #9 jules.webb286095

Well, I've made some progress. Carl you were right, in the end the elusive width property was to blame after all. I found the specific culprit in the menu_ie.css file. There were seven possibilities and I narrowed it down to: ul#cssmw li span a

Ray; I went ahead and used an absolute link for the conditional ie6 global style sheet, so no matter where you are in the site the link is correct.

So my menu is now displaying horizontal, but I am still having 2 issues.

1. The text "For appointments call..." is not a link; I have separate css rules that control it's appearance and it looks fine in all browsers I've checked except IE6--- which will display it fine at first, but then reverts to an un-styled state. I have completely stripped test.php down if you want to see a version without all the other code. I believe it is the javascript file menu.js that is somehow interfering, but I don't know enough about javascript to be sure or trouble shoot it.

2. If I am on any of the pages listed under "About ACA" I am unable to mouse over either of the two drop down menus. If I am currently on one of the pages listed under "Online Store" I don't have any problems. This problem is only in IE6.

Thanks for the help guys, and if you can think of any other suggestions I'd be grateful:-)

Cheers!
Jules

3/19/2009 3:55 pm | #10 jules.webb286095

I just thought I would add a quick update to the above post.

I resolved issue #1 by making my "For appointments call..." a dead link using javascript:void(0); and then using id selectors instead of classes for my css rules. For some reason the javascript at the end of the menu.php page (see below) was interfering with the rendering in ie6. It would render fine at first and then it was like the added custom css rules were erased and the text resolved with no styling.

My second issue still remains and I plan on creating a new post to see if I can't get some help resolving it.

Cheers
Jules

<script type="text/javascript">if(window.attachEvent) { window.attachEvent("onload", function() { cssmw.intializeMenu('cssmw'); }); } else if(window.addEventListener) { window.addEventListener("load", function() { cssmw.intializeMenu('cssmw'); }, true); }</script>

Technical Support Forums

Free, outstanding support from WebAssist and your colleagues

Horizontal navigation displays as vertical in ie6

3/12/2009 9:51 pm | #1 jules.webb286095