• artsyandi

    (@artsyandi)


    I am having a problem with browser compatibility. Some of the CSS styles are not showing up on my page.

    The blog is at http://www.babybumps.net/blog

    The main problem is that in Mozilla and Safari, the background wrapper is dropping out right before the navigation bar (the background disappears). Since this part is still in the header file, I’m not sure what is going wrong.

    Here is the code for the index:

    <?php get_header(); ?>	
    
    <div id="content-wrap" class="two-col"  >	
    
    <?php get_sidebar(); ?>
    
    <div id="main">  <div id="content">
    
    <!-- here comes the loop -->
    
    <?php if (have_posts()) : ?>
    <?php while (have_posts()) :
    the_post(); ?>
    
    <div class="post" id="post-<?php the_ID(); ?>">
    
    <h2><a href="<?php the_permalink() ?>"
    rel="bookmark" title="Go to
    <?php the_title(); ?>"><?php the_title(); ?></a></h2>
    
    <small><?php the_time('F jS, Y') ?>
    <!-- by <?php the_author() ?> --></small>
    
    <div class="entry"><br />
    
    <?php the_content('Read the rest of this entry »'); ?>
    
    </div>
    
    <p class="postmetadata">Posted in <?php the_category(', ') ?> |
    <?php edit_post_link('Edit', '', ' | '); ?>
    <?php comments_popup_link('No Comments »',
    '1 Comment »', '% Comments »'); ?></p><br />
    
    </div>
    
    <?php endwhile; ?>
    
    <div class="navigation">
    
    <div class="alignleft"><?php next_posts_link
    ('« Previous Entries') ?></div>
    
    <div class="alignright"><?php previous_posts_link
    ('Next Entries »') ?></div>
    
    </div>
    
    <?php else : ?>
    
    <h2 class="center">Not Found</h2>
    
    <p class="center">Sorry, but you are looking
    for something that isn't here.</p>
    
    <?php include (TEMPLATEPATH . "/searchform.php"); ?>
    
    <?php endif; ?>
    
    <!-- the loop is closed -->
    
    </div>
    </div>
    
    <?php get_footer(); ?>
    </div>
    
    </html>
    </body>

    Here is the code for the header:

    <!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"
    
    <head profile="http://gmpg.org/xfn/11">
    <!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">
    
    <head profile="http://gmpg.org/xfn/11">
    <meta http-equiv="Content-Type" content="<?php bloginfo('html_type'); ?>; charset=<?php bloginfo('charset'); ?>" />
    
    <title><?php wp_title(''); ?><?php if(wp_title('', false)) { echo ' |'; } ?> <?php bloginfo('name'); ?></title>
    
    <meta name="generator" content="WordPress <?php bloginfo('version'); ?>" /> <!-- leave this for stats -->
    
    <link rel="stylesheet" href="<?php bloginfo('stylesheet_url'); ?>" type="text/css" media="screen" />
    <link rel="alternate" type="application/rss+xml" title="<?php bloginfo('name'); ?> RSS Feed" href="<?php bloginfo('rss2_url'); ?>" />
    <link rel="pingback" href="<?php bloginfo('pingback_url'); ?>" />
    
    <!--we need this for plugins-->
    <?php wp_head(); ?>
    </head>
    <body>
    
    <div  id="wrap">
    
    <div id="header">			
    
    <div id="header-links">
    	<p class="style2">
    		<a href="http://www.babybumps.net/index.html">Home</a> |
    		<a href="http://www.babybumps.net/contact.html">Contact</a> |
    		<a href="http://www.babybumps.net/sitemap.html">Site Map</a>		</p>
    	  	</div>	</div>	
    
    <div id="header-photo"> <a href="http://www.babybumps.net/refer.html"><img src="http://babybumps.net/testsite/images/refer2.gif" alt="" width="150" height="150"  /></a></div>
    
    <div  id="nav">
    		<ul>
    			<li id="current"><a href="http://www.babybumps.net/index.html" class="style1">Home</a></li>
    			<li><a href="http://www.babybumps.net/index.html" class="style1">Local Resources </a></li>
    			<li><a href="http://www.babybumps.net/articles.html">Articles</a></li>
    			<li><a href="http://www.babybumps.net/calendar.php">Calendar</a></li>
    			<li><a href="http://www.babybumps.net/blog">Blog</a></li>
      <li><a href="http://www.babybumps.net/contact.html">Contact us! </a></li>
    		</ul></div>
    
            <!-- End Header -->

    Does anyone see where the problem is? I’m going crosseyed trying to find a misplaced div tag or something… any help is appreciated… and if you need more information, let me know. 🙂

The topic ‘Browser compatibility issues…’ is closed to new replies.