Header images don't show in IE7 or IE8 Compatability Mode

Styles for phpBB3 created by ModphpBB3 and Others.
Post Reply
User avatar
uk_martin
Forum Member
Forum Member
Posts: 85
Joined: Fri Jan 30, 2009 2:49 pm

Header images don't show in IE7 or IE8 Compatability Mode

Post by uk_martin »

This is my site in question: http://www.brummiesfans.com/main/

Using Internet Explorer 7, or even 8 when switching between compatability mode on & off, the header and logo images above the menu bar don't show.

I don't have these problems in IE8, Chrome or Firefox. Ideally I don't want this problem in IE7 either.

Any idea what the matter may be? Better still would be a cure.

If it helps, here's the code for the overall_header.html file:

Code: Select all

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" dir="{S_CONTENT_DIRECTION}" lang="{S_USER_LANG}" xml:lang="{S_USER_LANG}">
<head>
<link rel="alternate" type="application/rss+xml" title="Forum" href="rss.php">
<meta http-equiv="content-type" content="text/html; charset={S_CONTENT_ENCODING}" />
<meta http-equiv="content-style-type" content="text/css" />
<meta http-equiv="content-language" content="{S_USER_LANG}" />
<meta http-equiv="imagetoolbar" content="no" />
<meta name="resource-type" content="document" />
<meta name="distribution" content="global" />
<meta name="copyright" content="2000, 2002, 2005, 2007 phpBB Group" />
<meta name="keywords" content="{PAGE_KEYWORDS}" />
<meta name="description" content="{PAGE_DESCRIPTION}" />
{META}
<title>{SITENAME} &bull; <!-- IF S_IN_MCP -->{L_MCP} &bull; <!-- ELSEIF S_IN_UCP -->{L_UCP} &bull; <!-- ENDIF -->{PAGE_TITLE}</title>



<script type="text/javascript">
// <![CDATA[
   var jump_page = '{LA_JUMP_PAGE}:';
   var on_page = '{ON_PAGE}';
   var per_page = '{PER_PAGE}';
   var base_url = '{A_BASE_URL}';
   var style_cookie = 'phpBBstyle';
   var style_cookie_settings = '{A_COOKIE_SETTINGS}';
   var onload_functions = new Array();
   var onunload_functions = new Array();

   <!-- IF S_USER_PM_POPUP -->
      if ({S_NEW_PM})
      {
         var url = '{UA_POPUP_PM}';
         window.open(url.replace(/&/g, '&'), '_phpbbprivmsg', 'height=225,resizable=yes,scrollbars=yes, width=400');
      }
   <!-- ENDIF -->

   /**
   * Find a member
   */
   function find_username(url)
   {
      popup(url, 760, 570, '_usersearch');
      return false;
   }

   /**
   * New function for handling multiple calls to window.onload and window.unload by pentapenguin
   */
   window.onload = function()
   {
      for (var i = 0; i < onload_functions.length; i++)
      {
         eval(onload_functions[i]);
      }
   }

   window.onunload = function()
   {
      for (var i = 0; i < onunload_functions.length; i++)
      {
         eval(onunload_functions[i]);
      }
   }

// ]]>
</script>
<script type="text/javascript" src="{T_TEMPLATE_PATH}/styleswitcher.js"></script>
<script type="text/javascript" src="{T_TEMPLATE_PATH}/forum_fn.js"></script>
<!-- IF S_NEW_DL_POPUP -->
<script language="Javascript" type="text/javascript">
// <![CDATA[
   window.open('{U_NEW_DOWNLOAD_POPUP}', '_blank', 'HEIGHT=225,resizable=yes,WIDTH=400');
// ]] >
</script>
<!-- ENDIF -->
<link href="{T_THEME_PATH}/print.css" rel="stylesheet" type="text/css" media="print" title="printonly" />
<!-- IF S_NEW_DL_POPUP -->
<script language="Javascript" type="text/javascript">
// <![CDATA[
   window.open('{U_NEW_DOWNLOAD_POPUP}', '_blank', 'HEIGHT=225,resizable=yes,WIDTH=400');
// ]] >
</script>
<!-- ENDIF -->
<link href="{T_STYLESHEET_LINK}" rel="stylesheet" type="text/css" media="screen, projection" />

<link href="{T_THEME_PATH}/normal.css" rel="stylesheet" type="text/css" title="A" />
<link href="{T_THEME_PATH}/medium.css" rel="alternate stylesheet" type="text/css" title="A+" />
<link href="{T_THEME_PATH}/large.css" rel="alternate stylesheet" type="text/css" title="A++" />

<!-- IF S_CONTENT_DIRECTION eq 'rtl' -->
   <link href="{T_THEME_PATH}/bidi.css" rel="stylesheet" type="text/css" media="screen, projection" />
<!-- ENDIF -->
<script type="text/javascript" src="{U_SHOUT_STATIC}"></script>
<script type="text/javascript" src="{T_TEMPLATE_PATH}/editor.js"></script>
<script type="text/javascript" src="{U_SHOUT}"></script>
<script type="text/javascript" src="highslide/highslide-full.js"></script>
<script type="text/javascript">
   // remove the registerOverlay call to disable the controlbar
   hs.registerOverlay(
       {
          thumbnailId: null,
          overlayId: 'controlbar',
          position: 'top right',
          hideOnMouseOut: true
      }
   );

    hs.graphicsDir = 'highslide/graphics/';
    hs.outlineType = 'rounded-white';
</script>
<script type="text/javascript" src="{T_TEMPLATE_PATH}/gallery_lytebox.js"></script>
<script type="text/javascript" >
   if (window.addEventListener) {
      window.addEventListener("load",initLytebox,false);
   } else if (window.attachEvent) {
      window.attachEvent("onload",initLytebox);
   } else {
      window.onload = function() {initLytebox();}
   }
   function initLytebox() {
      var imgMaxWidth = 1280;
      var imgWarning = '';
      myLytebox = new LyteBox(imgMaxWidth, imgWarning);
   }
</script>

<!--[if IE 6]>
<style type="text/css">
html { overflow-y: hidden; }
body { overflow-y: auto; }
#bg { position:absolute; z-index:-1; }
#content { position:static; }
</style>
<![endif]-->

</head>

<body id="phpbb" class="section-{SCRIPT_NAME} {S_CONTENT_DIRECTION}">
<img src="{T_THEME_PATH}/images/background.jpg" id="bg" />
<div id="wrap">
    <div class="border-left">
    <div class="border-right">
    <div class="border-top">
    <div class="border-top-left">
    <div class="border-top-right">
        <div class="inside" style="direction: {S_CONTENT_DIRECTION}; ">
           <a id="top" name="top" accesskey="t"></a>
           <div id="page-header">
    {ADS_1}
      <div class="headerbar">
         <div class="inner">

         <div id="site-description">
            <a href="{U_INDEX}" title="{L_INDEX}" id="logo">{SITE_LOGO_IMG}</a>

            <p style="display: none;"><a href="#start_here">{L_SKIP}</a></p>
         </div>

      <!-- IF S_DISPLAY_SEARCH and not S_IN_SEARCH -->
         <div id="search-box">
            <form action="{U_SEARCH}" method="post" id="search">
            <fieldset>
               <input name="keywords" id="keywords" type="text" maxlength="128" title="{L_SEARCH_KEYWORDS}" class="inputbox search" value="<!-- IF SEARCH_WORDS-->{SEARCH_WORDS}<!-- ELSE -->{L_SEARCH_MINI}<!-- ENDIF -->" onclick="if(this.value=='{LA_SEARCH_MINI}')this.value='';" onblur="if(this.value=='')this.value='{LA_SEARCH_MINI}';" /> 
               <input class="button2" value="{L_SEARCH}" type="submit" /><br />
               <a href="{U_SEARCH}" title="{L_SEARCH_ADV_EXPLAIN}">{L_SEARCH_ADV}</a> {S_SEARCH_HIDDEN_FIELDS}
            </fieldset>
            </form>
         </div>
      <!-- ENDIF -->
   <span class="corners-bottom"></span> 
      </div>
      </div>
       

      <div class="navbar">
         <div class="inner" align="center">
            <ul class="nav_top">
            <!-- IF not S_IS_BOT -->
                     <li><a href="{U_PORTAL}">{L_PORTAL}</a>
                     <li><a href="{U_INDEX}">News</a>                     
                     <li><a href="http://www.brummiespeedway.net/forum">Forum</a>
                     <li><a href="/gallery">Gallery</a>
                     <li><a href="/main/template.php?cms=article_Welcome">Fans Info</a>               
                     <li><a href="/main/chat.php">Chat</a>
                     <li><a href="{U_ARCADE}">{L_ARCADE}</a>
                     <li><a href="/main/downloads.php">Downloads</a>
                     <!-- IF not S_USER_LOGGED_IN -->
                     <li><a href="{U_REGISTER}">{L_REGISTER}</a>
                     <!-- ENDIF -->
                     <li><a href="{U_PROFILE}">{L_PROFILE}</a>
                     <!-- IF S_USER_LOGGED_IN -->

                     <!-- ENDIF -->
                     <li><a href="{U_LOGIN_LOGOUT}">{L_LOGIN_LOGOUT}</a>
            <!-- ENDIF -->
            </ul>

         <span class="corners-bottom"><span></span></span></div>
      </div>

   </div>
    
       <!-- IF ADS_2 -->
   <br />
   <div class="forabg">
      <div class="inner"><span class="corners-top"><span></span></span>
         <ul class="topiclist">
            <li class="header">
               <dl class="icon">
                  <dt>{L_ADVERTISEMENT}</dt>
               </dl>
            </li>
         </ul>
         <div style="padding: 5px 5px 2px 5px; font-size: 1.1em; background-color: #ffdd00; margin: 0px auto; text-align: center;">
            {ADS_2}
         </div>
      <span class="corners-bottom"><span></span></span></div>
   </div>
   <!-- ENDIF -->

   <a name="start_here"></a>
   <div id="page-body">

      <!-- IF S_NEW_DL_MESSAGE -->
         <div id="message" class="rules">
            <div class="inner"><span class="corners-top"><span></span></span>
               {NEW_DOWNLOAD_MESSAGE}
            <span class="corners-bottom"><span></span></span></div>
         </div>
      <!-- ENDIF -->

       <!-- IF S_BOARD_DISABLED and S_USER_LOGGED_IN and (U_MCP or U_ACP) --> 
      <div id="message" class="rules">
         <div class="inner"><span class="corners-top"><span></span></span>
            <strong>{L_INFORMATION}:</strong> {L_BOARD_DISABLED}
         <span class="corners-bottom"><span></span></span></div>
      </div>
      <!-- ENDIF -->
        <!-- IF S_IN_ARCADE and S_ARCADE_DISABLED and S_USER_LOGGED_IN and U_ACP -->
      <div id="message" class="rules">
         <div class="inner"><span class="corners-top"><span></span></span>
            <strong>{L_INFORMATION}:</strong> {L_ARCADE_DISABLED}
         <span class="corners-bottom"><span></span></span></div>
      </div>
      <!-- ENDIF -->
All help appreciated.

Thanks

Martin
User avatar
LDM
Site Admin
Site Admin
Posts: 1786
Joined: Thu May 29, 2008 6:51 pm

Re: Header images don't show in IE7 or IE8 Compatability Mod

Post by LDM »

Hello Martin,

Any chance you take some screenshots of the problem. I'm not running those browsers you are getting issues with.
User avatar
cisco007
Staff
Staff
Posts: 501
Joined: Tue Oct 07, 2008 3:44 am

Re: Header images don't show in IE7 or IE8 Compatability Mod

Post by cisco007 »

well i only have IE8 don't have IE7 but when i tried with compatability on and off, it worked for me!
User avatar
uk_martin
Forum Member
Forum Member
Posts: 85
Joined: Fri Jan 30, 2009 2:49 pm

Re: Header images don't show in IE7 or IE8 Compatability Mod

Post by uk_martin »

Fixed now thanks. Seems that there were some missing (and empty!) <span></span> tags in the overall_header.html file. Exactly why empty tags make a difference is beyond me, and no doubt some HTML/CSS expert can let us know. However, thanks for the time taken out to look.
Post Reply