...

View Full Version : Menu Not Showing Up In IE 9.0 - Browser Bug?



wolfcry044
02-02-2012, 01:03 PM
I'm having an issue in Internet Explorer 9.0 that is not happening in any other browsers that I've checked. I can't pinpoint where the issue is, but I gather it's a browser bug, probably in the stylesheet. I've validated the entire site, it's error free.

Here's the link:
Promote First (http://www.promote1st.com)
(Keep in mind the site is a work in progress so it's unfinished yet)

You'll notice that it should look fine in all browsers except Internet explorer 9.0. In IE 9.0 the menu at the top right disappears and doesn't show up properly.

Link to stylesheet:
http://www.promote1st.com/style.css

I'm thinking it has something to do with the navigation class in the stylesheet, something in there bugging IE out.

Link to the navigation menu:
http://www.promote1st.com/includes/navigation.php

Code to navigation menu:


<ul class="navigation">
<li><a href="http://www.promote1st.com/clients/">Login</a></li>
<li><a href="#">sitemap</a></li>
<li><a href="#">Help</a></li>
</ul><?php /* End Sub-menu */ ?>

<div class="clear"></div>

<ul class="menu">
<li><a class="active" href="http://www.promote1st.com">about us</a></li>
<li><a href="">services</a></li>
<li><a href="">solutions</a></li>
<li><a href="">support</a></li>
<li><a href="">partners</a></li>
<li><a href="mailto:don@promote1st.com">contact us</a></li>
</ul><?php /* End Menu */ ?>

Thank you for your time and any assistance with this issue.

Excavator
02-02-2012, 02:18 PM
Good morning wolfcry044,
I didn't mess with this a lot once I saw you were using cufon so I may be wrong.
When you don't give your floated elements a width, it has to be inherited from something. The only thing .fright, .menu or .menu li can get a width from is the text of the anchors and those have no width if your cufon is not working.

http://blog.ninanet.com/2011/04/29/cufon-and-ie9

wolfcry044
02-02-2012, 02:22 PM
Oh.. Cufon doesn't work in IE 9.0... that explains it.
Thanks.

wolfcry044
02-02-2012, 02:28 PM
*Edit* I replaced the cufon file and now the font is dark and bold, the same as it is without cufon active

coothead
02-02-2012, 02:28 PM
Hi there wolfcry044,

it seems that the cause of your problems in IE9 is this...

<script src="js/cufon-replace.js" type="text/javascript"></script>

...which has this single line of code...

Cufon.replace('.menu li, h3', { fontFamily: 'Swis721 Lt BT', hover:true });

I have not tested the problem in IE8.

This code...

<!--[if !IE 9]><!-->
<script src="js/cufon-replace.js" type="text/javascript"></script>
<!--<![endif]-->

...would resolve the problem for IE9 only.
This code..

<!--[if !IE]><!-->
<script src="js/cufon-replace.js" type="text/javascript"></script>
<!--<![endif]-->

...would resolve the problem for all IE browsers.

coothead

wolfcry044
02-02-2012, 02:33 PM
Like this?


<?php /* IE Conditional Styling */ ?>
<!--[if lt IE 7]>
<link href="ie_style.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="js/ie_png.js"></script>
<script type="text/javascript">
ie_png.fix('.png');
</script>
<![endif]-->

<!--[if !IE]><!-->
<script src="js/cufon-replace.js" type="text/javascript"></script>
<!--<![endif]-->


<?php /* Script Sources*/ ?>
<script src="http://www.promote1st.com/js/jquery-1.3.2.min.js" type="text/javascript"></script>
<script src="js/cufon-yui.js" type="text/javascript"></script>
<script src="js/cufon-replace.js" type="text/javascript"></script>
<script src="js/Swis721_Lt_BT_400.font.js" type="text/javascript"></script>

wolfcry044
02-02-2012, 02:37 PM
When I put the new cufon file in, it works in all browsers but the font goes from smaller and lighter (the way it was originally) to extremely dark and bold. How do I fix that?

wolfcry044
02-02-2012, 03:01 PM
For the life of me I can't figure out why that new cufon file messed up the font. Tried looking at the code in the cufon file but it's just a big wall of code, don't know where to begin to look for what's causing it.

It doesn't look good dark and bold like that.

Looks like the cufon-yui isn't being read now, that's why it's bolded. For some reason it's not reading that it's there anymore

wolfcry044
02-02-2012, 03:19 PM
I got it. I downloaded cufon-yui.js from the following location:
http://www.egypt-webdesign.com/designers-developers-come-here/cufon-yui-js-ie9-fix.htm

And it works now. The file they had on the other site must have not been in the right format or something.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum