[Last Call] Learn how to a build a cloud-first strategyRegister Now

x
?
Solved

Why does my Fireworks-created menu have missing images and gray lines through it in non-Firefox browsers?

Posted on 2008-09-30
13
Medium Priority
?
599 Views
Last Modified: 2013-12-13
We have a set of menus at the top of our new website.  I started creating them this afternoon and dropped a test version onto a page.  When I looked in Firefox, I was really happy.  When I looked in IE, however, my heart sank.  It's a mess!  I can't describe it with words as well as I can images, so refer to the attached images.

After looking at the images, check out the code.  I'm including the code for the include file before the code for the page.  Maybe something I have elsewhere on the page is conflicting.  Too much JavaScript, maybe??  No matter what I do to change the stuff in the include file, it doesn't make any impact on the page.  I know this question is a mess, but it's the end of the day and I'm hoping someone can look and say "Oh, here's the answer, silly!"  I've been on this for three hours!  Argh!

I wish I could offer 3000 points for this question because it would be worth it to me!
<div id="FWTableContainer760073154">
<table border="0" cellpadding="0" cellspacing="0" width="800">
<!-- fwtable fwsrc="small_masthead.png" fwpage="Page 1" fwbase="small_masthead.jpg" fwstyle="Dreamweaver" fwdocid = "760073154" fwnested="0" -->
  <tr>
<!-- Shim row, height 1. -->
   <td><img src="/dry_dock/planning/images/small_masthead_menus/spacer.gif" width="632" height="1" border="0" alt="" /></td>
   <td><img src="/dry_dock/planning/images/small_masthead_menus/spacer.gif" width="36" height="1" border="0" alt="" /></td>
   <td><img src="/dry_dock/planning/images/small_masthead_menus/spacer.gif" width="16" height="1" border="0" alt="" /></td>
   <td><img src="/dry_dock/planning/images/small_masthead_menus/spacer.gif" width="50" height="1" border="0" alt="" /></td>
   <td><img src="/dry_dock/planning/images/small_masthead_menus/spacer.gif" width="14" height="1" border="0" alt="" /></td>
   <td><img src="/dry_dock/planning/images/small_masthead_menus/spacer.gif" width="43" height="1" border="0" alt="" /></td>
   <td><img src="/dry_dock/planning/images/small_masthead_menus/spacer.gif" width="9" height="1" border="0" alt="" /></td>
   <td><img src="/dry_dock/planning/images/small_masthead_menus/spacer.gif" width="1" height="1" border="0" alt="" /></td>
  </tr>
 
  <tr><!-- row 1 -->
   <td colspan="7"><img name="small_masthead_r1_c1" src="/dry_dock/planning/images/small_masthead_menus/small_masthead_r1_c1.jpg" width="800" height="7" border="0" id="small_masthead_r1_c1" alt="" /></td>
   <td><img src="/dry_dock/planning/images/small_masthead_menus/spacer.gif" width="1" height="7" border="0" alt="" /></td>
  </tr>
  <tr><!-- row 2 -->
   <td rowspan="2"><img name="small_masthead_r2_c1" src="/dry_dock/planning/images/small_masthead_menus/small_masthead_r2_c1.jpg" width="632" height="57" border="0" id="small_masthead_r2_c1" alt="" /></td>
   <td><a href="javascript:;" onmouseout="MM_menuStartTimeout(1000);" onmouseover="MM_menuShowMenu('MMMenuContainer0923144102_0', 'MMMenu0923144102_0',0,20,'small_masthead_r2_c2');"><img name="small_masthead_r2_c2" src="small_masthead_r2_c2.jpg" width="36" height="15" border="0" id="small_masthead_r2_c2" alt="" /></a></td>
   <td rowspan="2"><img name="small_masthead_r2_c3" src="/dry_dock/planning/images/small_masthead_menus/small_masthead_r2_c3.jpg" width="16" height="57" border="0" id="small_masthead_r2_c3" alt="" /></td>
   <td><img name="small_masthead_r2_c4" src="/dry_dock/planning/images/small_masthead_menus/small_masthead_r2_c4.jpg" width="50" height="15" border="0" id="small_masthead_r2_c4" alt="" /></td>
   <td rowspan="2"><img name="small_masthead_r2_c5" src="/dry_dock/planning/images/small_masthead_menus/small_masthead_r2_c5.jpg" width="14" height="57" border="0" id="small_masthead_r2_c5" alt="" /></td>
   <td><img name="small_masthead_r2_c6" src="/dry_dock/planning/images/small_masthead_menus/small_masthead_r2_c6.jpg" width="43" height="15" border="0" id="small_masthead_r2_c6" alt="" /></td>
   <td rowspan="2"><img name="small_masthead_r2_c7" src="/dry_dock/planning/images/small_masthead_menus/small_masthead_r2_c7.jpg" width="9" height="57" border="0" id="small_masthead_r2_c7" alt="" /></td>
   <td><img src="spacer.gif" width="1" height="15" border="0" alt="" /></td>
  </tr>
  <tr><!-- row 3 -->
   <td><img name="small_masthead_r3_c2" src="/dry_dock/planning/images/small_masthead_menus/small_masthead_r3_c2.jpg" width="36" height="42" border="0" id="small_masthead_r3_c2" alt="" /></td>
   <td><img name="small_masthead_r3_c4" src="/dry_dock/planning/images/small_masthead_menus/small_masthead_r3_c4.jpg" width="50" height="42" border="0" id="small_masthead_r3_c4" alt="" /></td>
   <td><img name="small_masthead_r3_c6" src="/dry_dock/planning/images/small_masthead_menus/small_masthead_r3_c6.jpg" width="43" height="42" border="0" id="small_masthead_r3_c6" alt="" /></td>
   <td><img src="spacer.gif" width="1" height="42" border="0" alt="" /></td>
  </tr>
<!--   This table was automatically created with Adobe Fireworks   -->
<!--   http://www.adobe.com   -->
</table>
<div id="MMMenuContainer0923144102_0">
	<div id="MMMenu0923144102_0" onmouseout="MM_menuStartTimeout(1000);" onmouseover="MM_menuResetTimeout();">
		<a href="http://taxes.co.frederick.va.us" id="MMMenu0923144102_0_Item_0" class="MMMIFVStyleMMMenu0923144102_0" onmouseover="MM_menuOverMenuItem('MMMenu0923144102_0');">
			Pay&nbsp;taxes
		</a>
		<a href="http://www.fcvotes.net" id="MMMenu0923144102_0_Item_1" class="MMMIVStyleMMMenu0923144102_0" onmouseover="MM_menuOverMenuItem('MMMenu0923144102_0');">
			Register&nbsp;to&nbsp;vote
		</a>
	</div>
</div>
 
 
 
 
 
 
 
 
 
 
 
<%@ Page Language="VB" %>
<% @Import Namespace="System.Web.Mail" %>
<% @Import Namespace="System.Data.SqlClient" %>
<% @Import Namespace="System.Web.Configuration" %>
 
 
<script language="vb" runat="server">
    
    Public Shared Sub SetFocus(ByVal control As Control)
        Dim sb As StringBuilder = New StringBuilder
        With sb
            .Append("" & Microsoft.VisualBasic.Chr(13) & "" & Microsoft.VisualBasic.Chr(10) & "<script language='JavaScript'>" & Microsoft.VisualBasic.Chr(13) & "" & Microsoft.VisualBasic.Chr(10) & "")
            .Append("<!--" & Microsoft.VisualBasic.Chr(13) & "" & Microsoft.VisualBasic.Chr(10) & "")
            .Append("function SetFocus()" & Microsoft.VisualBasic.Chr(13) & "" & Microsoft.VisualBasic.Chr(10) & "")
            .Append("{" & Microsoft.VisualBasic.Chr(13) & "" & Microsoft.VisualBasic.Chr(10) & "")
            .Append("" & Microsoft.VisualBasic.Chr(9) & "document.")
            Dim p As Control = control.Parent
            While Not (TypeOf p Is System.Web.UI.HtmlControls.HtmlForm)
                p = p.Parent
            End While
            .Append(p.ClientID)
            .Append("['")
            .Append(control.UniqueID)
            .Append("'].focus();" & Microsoft.VisualBasic.Chr(13) & "" & Microsoft.VisualBasic.Chr(10) & "")
            .Append("}" & Microsoft.VisualBasic.Chr(13) & "" & Microsoft.VisualBasic.Chr(10) & "")
            .Append("window.onload = SetFocus;" & Microsoft.VisualBasic.Chr(13) & "" & Microsoft.VisualBasic.Chr(10) & "")
            .Append("// -->" & Microsoft.VisualBasic.Chr(13) & "" & Microsoft.VisualBasic.Chr(10) & "")
            .Append("</" & "script>")
        End With
        control.Page.ClientScript.RegisterClientScriptBlock(control.GetType, "SetFocus", sb.ToString)
    End Sub 
    
</script>
 
<!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 runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Frederick County, VA -- Department of Planning &amp; Development</title>
<link rel="stylesheet" href="http://www.co.frederick.va.us/dry_dock/css/fredCoStyles.css" type="text/css" media="screen" />
<link rel="stylesheet" href="http://www.co.frederick.va.us/dry_dock/css/fredCoMenuStyles.css" type="text/css" media="screen" />
<style>
.summary {
	position: absolute;
	left: 8px;
	top: 490px;
}
</style>
<script language="JavaScript1.2" type="text/javascript" src="http://www.co.frederick.va.us/dry_dock/planning/js/mm_css_menu.js"></script>
<style type="text/css" media="screen">
	@import url("http://www.co.frederick.va.us/dry_dock/planning/css/small_masthead.css");
</style>
<script src="SpryAssets/SpryAccordion.js" type="text/javascript"></script>
<link href="SpryAssets/SpryAccordion.css" rel="stylesheet" type="text/css">
<script type="text/javascript" language="javascript">
<!--
function flashWindow(info)
{
	contentWindow = window.open(info, "aWindow", "location=0,width=750,height=600,scrollbars=yes,resizable=yes,screenX=300,screenY=300,top=400,left=400")
	contentWindow.focus()
}
//-->
</script>
</head>
 
<body>
<form id="zeePage" runat="server">
  <div id="contentDiv">
  	<!-- #INCLUDE FILE="/dry_dock/planning/includes/small_masthead.asp" -->
    <img src="/dry_dock/images/small_masthead.jpg" border="0" />
    
    <div id="contentPageContent">
      <h2 class="pageHead">The Department of Planning &amp; Development<br />
      <span class="pageSubHead">The Route 277 Triangle and Urban Center Land Use Plan</span></h2>
      <p class="pageText">The Route 277 Study effort has identified opportunities to create new communities, integrate land use and transportation choices, address community infrastructure needs, and expand the County's goals for economic development. The Route 277 Triangle and Urban Center Land Use Study promotes five main areas of new land use focus; the Route 277 Urban Center, the Route 277 Triangle; Center of Economy, Interstate Commercial @ 307, Neighborhood Commercial @ White Oak Woods, and Tasker Woods.</p>
      <p class="pageText">A series of maps which identify Future Land Use, Transportation, Community Facilities, and Historical, Natural and Recreational Resources within the study area are part of the land use plan. Also part of this effort, and in implementation of the Plan, is the addition of approximately 664 acres to the Urban Development Area (UDA) and 2,360 acres to the Sewer and Water Service Area (SWSA) of the Plan as depicted on the accompanying maps.</p>
      <p class="pageText">The Community was engaged throughout this planning effort which resulted in a high level of participation. The participation was enormously valuable to the overall study effort. Much of the discussion and many of the comments and issues offered by the public were incorporated in the land use plan. </p>
      <p class="pageText">&nbsp;</p>
<table width="578" height="255" border="0" align="center" cellpadding="0" cellspacing="0">
                    <tr>
                      <td width="296" valign="top">
                      <div id="Accordion1" class="Accordion" tabindex="0">                    
                    <div class="AccordionPanel">
                      <div class="AccordionPanelTab">The Plan</div>
                      <div class="AccordionPanelContent">
                        <table width="295" border="0" cellpadding="1">
                          <tr>
                            <td><a href="pdfs/fredco-277-update.pdf"><img src ="images/pdf.gif" width="29" height="31" border="0" /></a></td>
                            <td><span class="pageText"><a href="pdfs/fredco-277-update.pdf">Adobe PDF version</a></span></td>
                          </tr>
                          <tr>
                            <td width="39"><a href="docs/fredco-277-update.doc"><img src="images/word.gif" width="29" height="31" border="0" /></a></td>
                            <td width="232"><span class="pageText"><a href="docs/fredco-277-update.doc">MS Word version</a></span></td>
                          </tr>                          
                        </table>
                      </div>
                    </div>
                    <div class="AccordionPanel">
                      <div class="AccordionPanelTab">Maps</div>
                      <div class="AccordionPanelContent">
                      <table width="295" border="0" cellpadding="1">
                          <tr>
                            <td><a href="images/facilities.jpg"><img src="images/facilities.gif" width="29" height="31" border="0" /></a></td>
                            <td><span class="pageText"><a href="images/facilities.jpg">Facilities Map</a></span></td>
                          </tr>
                          <tr>
                            <td><a href="images/Triangle_LanduseStudyArea_Future_LandUse_ALT4x_UPDATE_1.jpg"><img src="images/future.gif" width="29" height="31" border="0" /></a></td>
                            <td><span class="pageText"><a href="images/Triangle_LanduseStudyArea_Future_LandUse_ALT4x_UPDATE_1.jpg">Future Land Use Map</a></span></td>
                          </tr>
                          <tr>
                            <td><a href="images/Triangle_LanduseStudyArea_Future_LandUse_UPDATE_1.jpg"><img src="images/transportation.gif" width="29" height="31" border="0" /></a></td>
                            <td><span class="pageText"><a href="images/Triangle_LanduseStudyArea_Future_LandUse_UPDATE_1.jpg">Transportation Map</a></span></td>
                          </tr>                          
                        </table>
                      </div>
                    </div>                    
                  </div>
                      <!--</td> INVALID MARKUP...changed by JRC on 9/16/08. -->
                      <td width="282" valign="top">
                      <table width="200" border="0" align="center" cellpadding="0">
                    <tr>
                      <td align="left" valign="top">
                      	<p><span class="subjectHeader">Voice your opinion!</span><br />
                           <span class="pageText">Call the Planning department at<br />
                           </span><span class="pageText">(540) 665-5651<br />
                      	  or use our <a href="javascript:newWindow('277Contact.aspx')">online contact form</a>.</span></p>
                      	<p class="pageText">&nbsp;</p>
                            </td>
                    </tr>
                  </table>                      </td>
                    </tr>
                  </table>
            </table>
    </div>
    
    <div id="leftNavBox-contentPages">
      <!-- #INCLUDE FILE="/dry_dock/planning/includes/planningMenus.asp" -->
      </div>
    <!-- #INCLUDE FILE="/dry_dock/includes/footer.asp" -->
  </div>
  
  <script type="text/javascript">
<!--
// var Accordion1 = new Spry.Widget.Accordion("Accordion1");
var Accordion1 = new Spry.Widget.Accordion("Accordion1", { useFixedPanelHeights: false, defaultPanel: -1 });
 
//-->
  </script>
  </form>
</body>
</html>

Open in new window

FF.jpg
IE7.jpg
IE6.jpg
0
Comment
Question by:mrcoulson
  • 7
  • 4
  • 2
13 Comments
 
LVL 75

Expert Comment

by:Michel Plungjan
ID: 22613466
Please show the HTML as rendered in view-source
or even better give a url
0
 
LVL 75

Expert Comment

by:Michel Plungjan
ID: 22613496
0
 
LVL 75

Expert Comment

by:Michel Plungjan
ID: 22613519
0
Industry Leaders: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

 
LVL 75

Expert Comment

by:Michel Plungjan
ID: 22613549
What does all that div and crap do before the actual document?

The code you pasted has invalid html in front of the actual document
0
 

Author Comment

by:mrcoulson
ID: 22613754
mplungjan: The second image is what Fireworks created.  I figured if I just removed references to those image slices, the code would just put the menus on without the extra images; however, that made no difference.  Also, the div before the actual document is part of the include.  Sorry if that was unclear.  I can only include one code snippet in my question, so I just put both parts in there.  The code from the include is to line 48.  The rest is the page.  

Also, the direct link is this: http://www.co.frederick.va.us/dry_dock/planning/SpecialProjects/277/277Study-experiment.aspx.

Thanks!
0
 
LVL 75

Accepted Solution

by:
Michel Plungjan earned 1000 total points
ID: 22613966
0
 
LVL 29

Assisted Solution

by:matrixnz
matrixnz earned 1000 total points
ID: 22615010
FireFox is a little misleading because it also doesn't work, if you right click the banner select properties you'll find that the image (http://www.co.frederick.va.us/dry_dock/planning/SpecialProjects/277/small_masthead_r2_c1.jpg) doesn't exist, as mplungjan has already mentioned, however because you have small_masthead.jpg as the background image it appears as though the images has loaded.  IE is basically showing the borders of where the images should be.

Cheers
0
 

Author Comment

by:mrcoulson
ID: 22616112
Where are you guys seeing those images in the code?  The img tag as it is in the code:

<img name="small_masthead_r3_c2" src="/dry_dock/planning/images/small_masthead_menus/small_masthead_r3_c2.jpg" width="36" height="42" border="0" id="small_masthead_r3_c2" alt="" />

Am I missing something embarrassingly simple?
0
 
LVL 75

Expert Comment

by:Michel Plungjan
ID: 22617221
Yes, but they are not on your server
0
 

Author Comment

by:mrcoulson
ID: 22617411
They are.  See the image.  If they're on the server, why can't the web browser find them?
folder.jpg
0
 
LVL 75

Expert Comment

by:Michel Plungjan
ID: 22617540
No idea. But I get

The page cannot be found
The page you are looking for might have been removed, had its name changed, or is temporarily unavailable.

Please try the following:

    * Make sure that the Web site address displayed in the address bar of your browser is spelled and formatted correctly.
    * If you reached this page by clicking a link, contact the Web site administrator to alert them that the link is incorrectly formatted.
    * Click the Back button to try another link.

HTTP Error 404 - File or directory not found.
Internet Information Services (IIS)
0
 
LVL 29

Assisted Solution

by:matrixnz
matrixnz earned 1000 total points
ID: 22618563
Same, as it looks like you've found you're images were pointing to the wrong directory, previously they were pointing to the same directory as the page now but using your screenshot above I saw that the path images was in a totally different directory i.e.
http://www.co.frederick.va.us/dry_dock/planning/images/small_masthead_menus/small_masthead_r2_c1.jpg

But I can see that you've now changed the paths and it's now displaying correctly.

Cheers
0
 

Author Comment

by:mrcoulson
ID: 22618604
Yeah, look, I'm a total idiot.  This whole time I was modifying stuff in the wrong include file and wondering why the changes were not showing up on the final page.  What a dummy!  I'll award you both points here.  Sorry for wasting your time.  So embarrassing.
0

Featured Post

Free Tool: Path Explorer

An intuitive utility to help find the CSS path to UI elements on a webpage. These paths are used frequently in a variety of front-end development and QA automation tasks.

One of a set of tools we're offering as a way of saying thank you for being a part of the community.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Many programs have tried to outwit PowerPoint in terms of technology and skill. These programs, however, still lack several characteristics that PowerPoint has possessed from the start. Here's why PowerPoint replacements won't entirely work for desi…
This article demonstrates how to create a simple responsive confirmation dialog with Ok and Cancel buttons using HTML, CSS, jQuery and Promises
In this tutorial viewers will learn how to create blended and gradiated shapes in Illustrator using the blend tool Draw two shapes, one of them in a different color: Select both and create a blend by going to Object > Blend > Make: Blends can also b…
In this second Micro Tutorial in the series,  viewers will learn more basic shortcuts and functions of Illustrator. In this tutorial you will learn about the eyedropper tool, zoom , ellipses and more.
Suggested Courses
Course of the Month17 days, 17 hours left to enroll

831 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question