Support » Fixing WordPress » IE displays out of alignment, flash movie missing in header ..weird

  • Resolved CindyGoBeyond

    (@cindygobeyond)


    Hello,

    http://www.Aug08.org

    Have a look at the website in both browsers. Firefox is
    doing it right, IE is not.

    There is a known <div id> issue in the header.php code that I cannot seem to correct (Dreamweaver highlights it).

    It would seem there should be a close-bracket (>) after
    =”true”/]
    but when I put it in there, it appears outside the
    flash movie, as text centred below it. (can be seen in the black background by dragging your mouse down the page).

    Having it in there does not make a difference to alignment or flash in IE.

    Help from you super-sleuths out there is much appreciated!
    Cindy

    ——- header.php

    <!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" <?php language_attributes(); ?>>
    
    <head profile="http://gmpg.org/xfn/11">
    <meta http-equiv="Content-Type" content="<?php bloginfo('html_type'); ?>; charset=<?php bloginfo('charset'); ?>" />
    
    <title><?php if ( function_exists('optimal_title') ) { optimal_title('|'); bloginfo('name'); } else { bloginfo('name'); wp_title('|'); } ?><?php if
    ( is_home() ) { ?> | <?php bloginfo('description'); } ?></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'); ?>" />
    
    <style type="text/css" media="screen">
    
    <?php
    // Checks to see whether it needs a sidebar or not
    if ( !$withcomments && !is_single() ) {
    ?>
    
    	#page { background: url("<?php bloginfo('stylesheet_directory'); ?>/images/kubrickbg.jpg") repeat-y top; border: none; }
    <?php } else { // No sidebar ?>
    	#page { background: url("<?php bloginfo('stylesheet_directory'); ?>/images/kubrickbgwide.jpg") repeat-y top; border: none; }
    <?php } ?>
    
    </style>
    
    <?php wp_head(); ?>
    </head>
    <body>
    <div id="page">
    
    <div id="header" align="center" [kml_flashembed movie="http://www.aug08.org/movie4.swf" height="215" width="760" fversion="9" useexpressinstall="true"/]>
    	<div id="headerimg">
    		<h1><a href="<?php echo get_option('home'); ?>/"><?php bloginfo('name'); ?></a></h1>
    		<div class="description"><?php bloginfo('description'); ?></div>
    	</div>
    </div>
    <hr />

Viewing 15 replies - 1 through 15 (of 27 total)
  • Try validating your html and you’ll find that you’ve got an issue with a missing > somewhere.

    even correcting the missing </div>, as suggested by the validator, simply puts the page out of alignment in firefox also : /

    Is there anyone else who can look at the code?
    Many thanks,
    Cindy

    Moderator kmessinger

    (@kmessinger)

    If your issue is the flash movie not playing in IE correct the errors you are shown in the DW validation on line 41 and 52.

    Hi thanks for replying.
    There is no line 52 in the DW validation, and
    this line (41):

    <div id=”header” align=”center” <div id=”so_targ_movie4_1919294432″ class=”flash

    does not exist in the header (see header code above).
    It doesn’t seem to exist anywhere I can find.
    Neither do the errors on line 109, 145, or 149

    this is the code with the flash embedded in my PHP file:

    <div id=”header” align=”center” [kml_flashembed movie=”http://www.aug08.org/movie4.swf” height=”215″ width=”760″ fversion=”9″ useexpressinstall=”true”/]>

    comparing the two, is kimli adding its own “<div id=”
    on the fly, substituting “so_targ_movie4_1919294432” on the fly, and have I placed the flash movie wrongly? I could not find specific details on exactly where/how to use it.

    Moderator kmessinger

    (@kmessinger)

    Line 41 <div id=”header” align=”center”ERROR<div id=”so_targ_movie4_49014873″ class=”flashmovie”></div>
    Line 52 > ERROR

    These line are where you inserted your flash movie. Correct them and it plays.

    All errors in validation either thru DW or http://validator.w3.org/ can and should be corrected as they validate the html, not the php.

    Bring up your site on a browser, look at source and copy it. Paste that into wordpad or Dreamweaver or anything where you can see the line numbers. This way you can find out what section the errors are in like heading, footer, sidebar, etc.

    Hi,
    I just viewed the source (good idea)…and isn’t it interesting how the movie numbers are different every time?

    <div id=”header” align=”center” <div id=”so_targ_movie4_159665973″ class=”flashmovie”>

    and repeated it in IE:
    <div id=”so_targ_movie4_33075269″ class=”flashmovie”>

    something is generating that code…the kimili plug-in?

    Perhaps I should remove the <div id=”header” align=”center”
    before it, (which I can do) so it will not interfere?

    Cindy –

    Yes, that’s a random number generated by KFE, unique every time you use a KFE tag is processed, put there so you can embed multiple instances of the same file on a page without a problem.

    And as for the embedding of the KFE tag, you don’t want to embed it in the middle of an element, as you have done:

    <div id="header" align="center" [kml_flashembed movie="http://www.aug08.org/movie4.swf" height="215" width="760" fversion="9" useexpressinstall="true"/]>

    That’s going to give you validation errors and unpredictable results. You want to embed nested it in an element like so:

    <div id="header" align="center">
        [kml_flashembed movie="http://www.aug08.org/movie4.swf" height="215" width="760" fversion="9" useexpressinstall="true"/]
    </div>

    The KFE tag will get replaced by an additional Div element (<div id="so_targ_movie4_33075269" class="flashmovie"></div>), inside which the movie gets rendered.

    Hope this makes sense.

    Cheers,
    Michael

    Ahh yes! That got the movie playing in IE, and *almost* sorted-out the wordpress display issue…. there’s probably just one more tiny tweak somewhere… will check the validator for clues.

    Thank-you Michael!

    Ok, one last thing…there’s still an error, and it looks like wordpress is generating it in the side bar. Somewhere under the pages… (or is it a widget causing this?)

    Error Line 108, Column 12: end tag for “ul” which is not finished.

    All ideas warmly welcomed 🙂
    Cindy

    I think the missing is the first one here:

    <div id="sidebar">
    		<ul>
    			<?php 	/* Widgetized sidebar, if you have the plugin installed. */
    					if ( !function_exists('dynamic_sidebar') || !dynamic_sidebar() ) : ?>
    			<li>
    				<?php include (TEMPLATEPATH . '/searchform.php'); ?>
    			</li>
    
    			<!-- Author information is disabled per default. Uncomment and fill in your details if you want to use it.
    			<li><h2>Author</h2>
    			<p>A little something about you, the author. Nothing lengthy, just an overview.</p>
    			</li>
    			-->
    
    			<?php if ( is_404() || is_category() || is_day() || is_month() ||
    						is_year() || is_search() || is_paged() ) {
    			?> <li>
    
    			<?php /* If this is a 404 page */ if (is_404()) { ?>
    			<?php /* If this is a category archive */ } elseif (is_category()) { ?>
    			<p>You are currently browsing the archives for the <?php single_cat_title(''); ?> category.</p>
    
    			<?php /* If this is a yearly archive */ } elseif (is_day()) { ?>
    			<p>You are currently browsing the <a href="<?php bloginfo('url'); ?>/"><?php echo bloginfo('name'); ?></a> blog archives
    			for the day <?php the_time('l, F jS, Y'); ?>.</p>
    
    			<?php /* If this is a monthly archive */ } elseif (is_month()) { ?>
    			<p>You are currently browsing the <a href="<?php bloginfo('url'); ?>/"><?php echo bloginfo('name'); ?></a> blog archives
    			for <?php the_time('F, Y'); ?>.</p>
    
    			<?php /* If this is a yearly archive */ } elseif (is_year()) { ?>
    			<p>You are currently browsing the <a href="<?php bloginfo('url'); ?>/"><?php echo bloginfo('name'); ?></a> blog archives
    			for the year <?php the_time('Y'); ?>.</p>
    
    			<?php /* If this is a monthly archive */ } elseif (is_search()) { ?>
    			<p>You have searched the <a href="<?php echo bloginfo('url'); ?>/"><?php echo bloginfo('name'); ?></a> blog archives
    			for <strong>'<?php the_search_query(); ?>'</strong>. If you are unable to find anything in these search results, you can try one of these links.</p>
    
    			<?php /* If this is a monthly archive */ } elseif (isset($_GET['paged']) && !empty($_GET['paged'])) { ?>
    			<p>You are currently browsing the <a href="<?php echo bloginfo('url'); ?>/"><?php echo bloginfo('name'); ?></a> blog archives.</p>
    
    			<?php } ?>
    
    			</li> <?php }?>
    
    			<?php wp_list_pages('title_li=<h2>Pages</h2>' ); ?>
    
    			<li><h2>Archives</h2>
    				<ul>
    				<?php wp_get_archives('type=monthly'); ?>
    				</ul>
    			</li>

    Cindy, if you are having alignment issues still (in IE) you may want to help the notorious IE (seems we are always helping IE to properly display a page) and edit your code one more step.

    As it is now you have

    <div id=”header” align=”center”> <div id=”so_targ_movie4_23519649″ class=”flashmovie”></div>

    which gets the flash movie playing properly (kudos Mike) and to go one step further IE has a problem interpreting a div ID and an alignment in the same div. For example the line of code above this :

    <div id=”page”>
    <div align=”center”><span class=”style1″>

    the div id and the div align are broken out into separate tags. You can fix a lot of annoying problems this way.

    You may want to try that with the flash alignment problem as follows:

    <div id=”header”>
    <div align=”center”> <div id=”so_targ_movie4_23519649″ class=”flashmovie”></div></div>

    You need one more ending /ul because you have two starting ul tags, so you need the second ending /ul tag as follows

    <div id=”sidebar”>

      <?php /* Widgetized sidebar, if you have the plugin installed. */
      if ( !function_exists(‘dynamic_sidebar’) || !dynamic_sidebar() ) : ?>

    • <?php include (TEMPLATEPATH . ‘/searchform.php’); ?>
    • <!– Author information is disabled per default. Uncomment and fill in your details if you want to use it.

    • <h2>Author</h2>
      <p>A little something about you, the author. Nothing lengthy, just an overview.</p>
    • –>

      <?php if ( is_404() || is_category() || is_day() || is_month() ||
      is_year() || is_search() || is_paged() ) {
      ?>

    • <?php /* If this is a 404 page */ if (is_404()) { ?>
      <?php /* If this is a category archive */ } elseif (is_category()) { ?>
      <p>You are currently browsing the archives for the <?php single_cat_title(”); ?> category.</p>

      <?php /* If this is a yearly archive */ } elseif (is_day()) { ?>
      <p>You are currently browsing the /”><?php echo bloginfo(‘name’); ?> blog archives
      for the day <?php the_time(‘l, F jS, Y’); ?>.</p>

      <?php /* If this is a monthly archive */ } elseif (is_month()) { ?>
      <p>You are currently browsing the /”><?php echo bloginfo(‘name’); ?> blog archives
      for <?php the_time(‘F, Y’); ?>.</p>

      <?php /* If this is a yearly archive */ } elseif (is_year()) { ?>
      <p>You are currently browsing the /”><?php echo bloginfo(‘name’); ?> blog archives
      for the year <?php the_time(‘Y’); ?>.</p>

      <?php /* If this is a monthly archive */ } elseif (is_search()) { ?>
      <p>You have searched the /”><?php echo bloginfo(‘name’); ?> blog archives
      for ‘<?php the_search_query(); ?>’. If you are unable to find anything in these search results, you can try one of these links.</p>

      <?php /* If this is a monthly archive */ } elseif (isset($_GET[‘paged’]) && !empty($_GET[‘paged’])) { ?>
      <p>You are currently browsing the /”><?php echo bloginfo(‘name’); ?> blog archives.</p>

      <?php } ?>

    • <?php }?>

      <?php wp_list_pages(‘title_li=<h2>Pages</h2>’ ); ?>

    • <h2>Archives</h2>
        <?php wp_get_archives(‘type=monthly’); ?>

    add second /ul here

    Sorry, that was not *all* of the code. There is a close /ul at the very end. I’ve looked at all the code very closely and can’t find the missing /ul.

    Worse than that, I do not know where to change this code as it appears dynamically generated, depending on the number of categories/list items.

    At a loss…

    ok, here is the frustrating part, the error is line 108 (which you may have to count them if you don’t have them numbered in a HTML editor that numbers the lines) and column 12 is 12 characters in from the margin (counting spaces). IF you have an ending /ul for every single starting ul, then I would say the error is erroneous, only making the job harder.
    The funny thing is you could try adding just one more ending /ul and see if that works (without knowing where the starting one is that needs to be satisfied).

    the validator does not spit out erroneous errors.

Viewing 15 replies - 1 through 15 (of 27 total)
  • The topic ‘IE displays out of alignment, flash movie missing in header ..weird’ is closed to new replies.