website cannot show main menu on IE8 and safari. but FF and Chrom are fine
The web link is:
http://www.beyondeu.com/
Anyone could offer any help?
Really appreciated.
website cannot show main menu on IE8 and safari. but FF and Chrom are fine
The web link is:
http://www.beyondeu.com/
Anyone could offer any help?
Really appreciated.
Hi oasisinthesky . Welcome to the forums.
It looks fine in Safari to me, but in IE8, it looks like many of the menu styles are served inside an @media rule, meaning that IE8 won’t get those styles. also, the #navigation div is set to display: none in IE8, though I’m not sure where that’s coming from. Anyhow, you need an alternative to @media rules for IE8. I’d say move the desktop styles out of the @media rules, or otherwise supply a conditional stylesheet for IE only.
Please Post the tags and code here,
Thanks ralph.m. I used my iphone and checked it. Its the same problem as the one in the IR8. Can you please be a bit more specific about the ways of solving it? The code is posted here.
<!DOCTYPE html>
<html dir=“ltr” lang=“en-US”>
<head>
<meta charset=“UTF-8” />
<title>Beyondeu</title>
<meta http-equiv=“Content-Type” content=“text/html; charset=UTF-8” />
<meta name=“robots” content=“index, follow” />
<link rel=“stylesheet” type=“text/css” href=“css/canvasstyle.css” media=“all” />
<link rel=‘stylesheet’ id=‘admin-bar-css’ href=‘css/admin-bar.css’ type=‘text/css’ media=‘all’ />
<link rel=‘stylesheet’ id=‘layout-css’ href=‘css/layout.css’ type=‘text/css’ media=‘all’ />
<link rel=‘stylesheet’ id=‘responsive-layout-css’ href=‘css/responsive-layout.css’ type=‘text/css’ media=‘screen’ />
<link rel=‘stylesheet’ id=‘prettyPhoto-css’ href=‘css/prettyPhoto.css’ type=‘text/css’ media=‘all’ />
<script type=‘text/javascript’ src=‘js/comment-reply.js’></script>
<script type=‘text/javascript’ src=‘js/jquery/jquery.js’></script>
<script type=‘text/javascript’ src=‘js/third-party.js’></script>
<script type=‘text/javascript’ src=‘js/jquery.flexslider.min.js’></script>
<script type=‘text/javascript’ src=‘js/slides.min.jquery.js’></script>
<script type=‘text/javascript’ src=‘js/feedback.js’></script>
<script type=‘text/javascript’ src=‘js/jquery.prettyPhoto.js’></script>
<script type=‘text/javascript’>
/* <![CDATA[ /
var woo_localized_data = {“select_a_page”:“Select a page:”};
/ ]]> */
</script>
<script type=‘text/javascript’ src=‘js/general.js’></script>
<style type=“text/css”>
#header {background-repeat:no-repeat;background-position:top center;margin-top:0px;margin-bottom:0px;padding-top:30px;padding-bottom:30px;border:0px solid ;}
#logo .site-title a {font:bold 40px/1em “Helvetica Neue”, Helvetica, sans-serif;color:#222222;}
#logo .site-description {font:normal 13px/1em “Helvetica Neue”, Helvetica, sans-serif;color:#999999;}
#wrapper {padding-left:30px; padding-right:30px;margin-top:20px;margin-bottom:20px;border-top:3px solid #dbdbdb;border-bottom:3px solid #dbdbdb;border-left:1px solid #dbdbdb;border-right:1px solid #dbdbdb;border-radius:3px;-moz-border-radius:3px;-webkit-border-radius:3px;box-shadow: 0px 1px 5px rgba(0,0,0,.3);-moz-box-shadow: 0px 1px 5px rgba(0,0,0,.3);-webkit-box-shadow: 0px 1px 5px rgba(0,0,0,.3);}
body, p { font:normal 13px/1.5em “Gill Sans”, “Gill Sans MT”, Calibri, sans-serif;color:#555555; }
h1 { font:bold 28px/1.5em “Gill Sans”, “Gill Sans MT”, Calibri, sans-serif;color:#222222; }h2 { font:bold 24px/1.5em “Gill Sans”, “Gill Sans MT”, Gill Sans MT, Gill Sans MT;color:#222222; }h3 { font:bold 20px/1.5em “Gill Sans”, “Gill Sans MT”, Calibri, sans-serif;color:#222222; }h4 { font:bold 16px/1.5em “Gill Sans”, “Gill Sans MT”, Calibri, sans-serif;color:#222222; }h5 { font:bold 14px/1.5em “Gill Sans”, “Gill Sans MT”, Calibri, sans-serif;color:#222222; }h6 { font:bold 12px/1.5em “Gill Sans”, “Gill Sans MT”, Calibri, sans-serif;color:#222222; }
.post .title, .page .title, .post .title a:link, .post .title a:visited, .page .title a:link, .page .title a:visited {font:bold 26px/1.2em “Helvetica Neue”, Helvetica, sans-serif;color:#222222;}
.post-meta { font:normal 11px/1.5em “Helvetica Neue”, Helvetica, sans-serif;color:#999999; }
.entry, .entry p{ font:normal 13px/1.5em “Helvetica Neue”, Helvetica, sans-serif;color:#555555; }
.post-more {font:normal 12px/1.5em “Helvetica Neue”, Helvetica, sans-serif;color:;border-top:0px solid #e6e6e6;border-bottom:0px solid #e6e6e6;}
#comments .comment.thread-even {background-color:#030303;}
#post-author, #connect {border-top:1px solid #e6e6e6;border-bottom:1px solid #e6e6e6;border-left:1px solid #e6e6e6;border-right:1px solid #e6e6e6;border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px;background-color:#fafafa}
#comments .comment.thread-even {background-color:#030303;}
.nav-entries a, .woo-pagination { font:normal 12px/1em “Helvetica Neue”, Helvetica, sans-serif;color:#888; }
.woo-pagination a, .woo-pagination a:hover {color:#888!important}
.widget h3 {font:bold 14px/1.5em “Helvetica Neue”, Helvetica, sans-serif;color:#555555;border-bottom:1px solid #e6e6e6;}
.widget_recent_comments li, #twitter li { border-color: #e6e6e6;}
.widget p, .widget .textwidget { font:normal 12px/1.5em Arial, sans-serif;color:#555555; }
.widget {font:normal 12px/1.5em Arial, sans-serif;color:#555555;background-color:#91918c;border:2px solid #dbdbdb;border-radius:0px;-moz-border-radius:0px;-webkit-border-radius:0px;}
#tabs {border:2px solid #dbdbdb;}
#tabs .inside li a { font:bold 12px/1.5em “Helvetica Neue”, Helvetica, sans-serif;color:#555555; }
#tabs .inside li span.meta { font:normal 11px/1.5em “Helvetica Neue”, Helvetica, sans-serif;color:#555555; }
#tabs ul.wooTabs li a { font:normal 11px/2em “Helvetica Neue”, Helvetica, sans-serif;color:#555555; }
ul.nav li a, #navigation ul.rss a { font:normal 18px/1em “Gill Sans”, “Gill Sans MT”, Calibri, sans-serif;color:#fffcfc; }
#navigation ul.nav > li a:hover, #navigation ul.nav > li:hover a, #navigation ul.nav li ul li a { color:#faf6f5!important; }
#navigation ul.nav > li a:hover, #navigation ul.nav > li:hover, #navigation ul.nav li ul {background-color:#f73c08!important}
#navigation ul.nav li ul { border: 0px solid #dbdbdb; }
#navigation ul.nav > li > ul { left: 0; }
#navigation ul.nav > li { border-right: 3px solid #dbdbdb; }#navigation ul.nav li.current_page_item a, #navigation ul.nav li.current_page_parent a, #navigation ul.nav li.current-menu-ancestor a, #navigation ul.nav li.current-cat a, #navigation ul.nav li.current-menu-item a { background-color:#fa3205; }
#navigation ul.nav li.current_page_item a, #navigation ul.nav li.current_page_parent a, #navigation ul.nav li.current-menu-ancestor a, #navigation ul.nav li.current-cat a, #navigation ul.nav li.current-menu-item a { color:#fcf9f9; }
#navigation { box-shadow: none; -moz-box-shadow: none; -webkit-box-shadow: none; }#navigation ul li:first-child, #navigation ul li:first-child a { border-radius:6px 0 0 6px; -moz-border-radius:6px 0 0 6px; -webkit-border-radius:6px 0 0 6px; }
#navigation {background:#345903;border-top:2px solid #dbdbdb;border-bottom:0px solid #dbdbdb;border-left:0px solid #dbdbdb;border-right:0px solid #dbdbdb;border-radius:6px; -moz-border-radius:6px; -webkit-border-radius:6px;}
#top, #top ul.nav li ul li a:hover { background:#136e12;}
#top ul.nav li a:hover, #top ul.nav li.current_page_item a, #top ul.nav li.current_page_parent a,#top ul.nav li.current-menu-ancestor a,#top ul.nav li.current-cat a,#top ul.nav li.current-menu-item a,#top ul.nav li.sfHover, #top ul.nav li ul, #top ul.nav > li:hover a, #top ul.nav li ul li a { color:#00010a!important;}
#top ul.nav li a:hover, #top ul.nav li.current_page_item a, #top ul.nav li.current_page_parent a,#top ul.nav li.current-menu-ancestor a,#top ul.nav li.current-cat a,#top ul.nav li.current-menu-item a,#top ul.nav li.sfHover, #top ul.nav li ul, #top ul.nav > li:hover { background:#f04208;}
#top ul.nav li a { font:normal 12px/1.6em “Gill Sans”, “Gill Sans MT”, Calibri, sans-serif;color:#ddd; }
#footer, #footer p { font:normal 13px/1em “Gill Sans”, “Gill Sans MT”, Calibri, sans-serif;color:#030000; }
#footer {background-color:#91918c;border-top:1px solid #dbdbdb;border-bottom:0px solid ;border-left:0px solid ;border-right:0px solid ;border-radius:0px; -moz-border-radius:0px; -webkit-border-radius:0px;}
.magazine #loopedSlider .content h2.title a { font:bold 24px/1em Gill Sans MT, Gill Sans MT;color:#ffffff; }
.magazine #loopedSlider .content .excerpt p { font:normal 12px/1.5em Gill Sans MT, Gill Sans MT;color:#cccccc; }
.business #loopedSlider .content h2 { font:bold 24px/1em “Gill Sans”, “Gill Sans MT”, Gill Sans MT, Gill Sans MT;color:#ffffff; }
.business #loopedSlider .content h2.title a { font:bold 24px/1em “Gill Sans”, “Gill Sans MT”, Gill Sans MT, Gill Sans MT;color:#ffffff; }
#wrapper .business #loopedSlider .content p { font:normal 18px/1.5em “Gill Sans”, “Gill Sans MT”, Gill Sans MT, Gill Sans MT;color:#080008; }
.archive_header h1 { font:bold 18px/1em Gill Sans MT, Gill Sans MT;color:#222222; }
.archive_header {border-bottom:1px solid #e6e6e6;}
</style>
<!-- Always force latest IE rendering engine (even in intranet) & Chrome Frame –>
<meta http-equiv=“X-UA-Compatible” content=“IE=edge,chrome=1” />
<!-- Mobile viewport scale –>
<meta content=“initial-scale=1.0; maximum-scale=1.0; user-scalable=yes” name=“viewport”/>
<style type=“text/css” media=“print”>#wpadminbar { display:none; }</style>
<style type=“text/css” media=“screen”>
html { margin-top: 28px !important; }
* html body { margin-top: 28px !important; }
</style>
<script type="text/javascript">
jQuery(window).load(function() {
var args = {};
args.animation = 'slide';
args.slideshow = true;
args.slideshowSpeed = 8000;
args.animationSpeed = 600;
args.controlNav = true;
args.pauseOnHover = false;
args.smoothHeight = true;
jQuery( '#loopedSlider' ).flexslider( args );
jQuery( '#loopedSlider a.flex-prev, #loopedSlider a.flex-next' ).addClass( 'icon' );
jQuery( '#loopedSlider .flex-control-nav' ).wrap( '<div class="pagination-wrap" />' );
});
</script>
<!-- Woo Shortcodes CSS –>
<link href=“functions/shortcodes.css” rel=“stylesheet” type=“text/css” />
<!-- Custom Stylesheet –>
<link href=“css/canvascustom.css” rel=“stylesheet” type=“text/css” />
</head>
<body class=“home page page-id-4 page-template page-template-template-biz-php logged-in admin-bar gecko has-lightbox boxed-layout one-col width-1120 one-col-1120”>
<div id=“wrapper”>
<div id="header" class="col-full">
<div id="logo">
<a href="index.html" title="beyondeu"><img src="images/beulogo42.png"/></a>
<h1 class=“site-title”><a href=“index.html”></a></h1>
</div><!-- /#logo -->
<h3 class="nav-toggle icon"><a href="#navigation">Navigation</a></h3>
</div><!-- /#header -->
<div id="navigation" class="col-full">
<ul id="main-nav" class="nav fl"><li id=""><a href="index.html">Home</a></li>
<li id=“menu-item-40” class=“”><a href=“about-us.html”>About Us</a></li>
<li id=“menu-item-58” class=“”><a href=“vision.html”>Vision</a></li>
<li id=“menu-item-62” class=“”><a href=“contact-us.html”>Contact Us</a></li>
</ul>
</div><!-- /#navigation –>
<!-- #content Starts -->
<div id="content" class="col-full business">
<div id="main-sidebar-container">
<div id="loopedSlider" class="has-pagination" style="height:auto;">
<ul class="slides">
<li id="slide-1" class="slide" style="">
<img src="images/Fotolia_41415849_M_mod.jpg" alt="doc" class="image" /><div class="content">
<div class="excerpt"><h2 style="text-align: left;">Connecting Patients to their Health Ecosystem</h2>
</div>
</div>
</li>
<li id="slide-2" class="slide" style="">
<img src="images/Fotolia_40160881_M_mod.jpg" alt="wheel" class="image"/><div class="content">
<div class="excerpt"><h2><span style="color: #ffffff;">Connecting Patients to their Health Ecosystem</span></h2>
</div>
</div>
</li>
</ul><!-- /.slides -->
</div><!-- /#loopedSlider –>
<!-- #main Starts –>
<div id=“main”>
<div class=“post-4 page type-page status-publish hentry”>
<div class=“entry”>
</div><!-- /.entry –>
<div class=“fix”></div>
</div><!-- /.post –>
</div><!-- /#main -->
</div><!-- /#main-sidebar-container -->
</div><!-- /#content -->
<div id="footer" class="col-full">
<div id="copyright" class="col-left">
<p><p>Copyright © 2012 Beyond eU. All rights reserved.</p></p> </div>
<div id="credit" class="col-right">
<p><p> </p></p> </div>
</div><!-- /#footer -->
</div><!-- /#wrapper -->
<div class="fix"></div><!--/.fix-->
<!--[if lt IE 9]>
<script src=“js/respond-ie.js”></script>
<![endif]–>
<script type=‘text/javascript’ src=‘js/admin-bar.js’></script>
<script type=“text/javascript”>
(function() {
var request, b = document.body, c = ‘className’, cs = ‘customize-support’, rcs = new RegExp(‘(^|\\s+)(no-)?’+cs+‘(\\s+|$)’);
request = true;
b[c] = b[c].replace( rcs, '' );
b[c] += ( window.postMessage && request ? ' ' : ' no-' ) + cs;
}());
</script>
</body>
</html>
seoexpertrizwan. plz see the code above. thanks.