Horizontal navigation displays as vertical in ie6 [Archive]

View Full Version : Horizontal navigation displays as vertical in ie6

jules.webb286095

03-12-2009, 09:51 PM

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: http://akacupuncture.webbdemo.com/
un: webassit
pw: guest

To see a page stripped of everything but the basic header info go to: http://akacupuncture.webbdemo.com/test.php

I appreciate any new leads someone has to offer.

Cheers!

Jules

Ray Borduin

03-13-2009, 07:35 AM

The path seems incorrect. I view source and see:



when it should be:

jules.webb286095

03-13-2009, 01:24 PM

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: http://akacupuncture.webbdemo.com/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

Ray Borduin

03-13-2009, 02:33 PM

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.

jules.webb286095

03-13-2009, 06:56 PM

Hey Ray, I updated the paths, but it doesn't seem to make any difference. Where to now?

Jules

Ray Borduin

03-14-2009, 07:18 AM

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>

carl_2005_65183847

03-14-2009, 10:24 AM

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

jules.webb286095

03-14-2009, 02:21 PM

Hi Ray, I fixed the path to the js file on the test page (it was correct in the other pages). IE7, Safari, and Firefox all see the menu correctly--- ie6 is the only browser that isn't displaying the menu in the horizontal position. Do you have any other suggestions?

Thanks for your persistence
Jules

jules.webb286095

03-14-2009, 02:34 PM

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

jules.webb286095

03-16-2009, 05:28 PM

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

jules.webb286095

03-19-2009, 03:55 PM

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>

bobrossi315677

07-16-2009, 04:26 PM

Still looking for solutions to this compatibility problem, not finding anything. Seems that WebAssist needs to look at this issue

Ray Borduin

07-17-2009, 07:06 AM

Which problem are you referring to? Do you have an example? There is no known issues with the functionality that I know of.