Web page not displaying correctly in firefox

Status
Not open for further replies.
C

c_mcbrutal

Hi all,

I am having a problem with our website displaying correctly in firefox. The hidden menu on services appears way down the page from where it should. Can anyone suggest anything?

css source
========
body {
margin-bottom: 0px;
font-family: Verdana;
font-size: 10px;
font-style: normal;
line-height: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
color: #878EAA;
}

td, textarea, input, select {
font-family: Verdana;
font-size: 10px;
color: #A3C350;
font-weight: normal;
}
.tableDetail {
font-size: 10px;
font-family: Verdana;
color: #878EAA;
}
.text1 {
font-family: Verdana;
font-size: 11px;
color: #898989;
}
.text2 {
font-family: Verdana;
font-size: 10px;
font-weight: normal;
color: #141414;
}
.text3 {
font-family: Verdana;
font-size: 10px;
font-weight: normal;
color: #28a8c5;
}
.frame {
font-family: Verdana;
font-size: 10px;
color: #FFFFFF;
border: 1px solid #990000;
}
.txt {
font-family: Verdana;
font-size: 11px;
color: #63803B;
line-height:15px;
}
.txt a{
font-family: Verdana;
font-size: 11px;
color: #63803B;
line-height:15px;
text-decoration:none;
}
.txt a:hover{
font-family: Verdana;
font-size: 11px;
color: #555555;
line-height:15px;
text-decoration:underline;
}
.blacktext{
font-family: verdana;
font-size: 11px;
color: #585858;
line-height:15px;
}
.blacktext a{
font-family: verdana;
font-size: 11px;
color: #585858;
line-height:15px;
text-decoration:none
}

.blacktext a:hover{
font-family: verdana;
font-size: 11px;
color: #f9631f;
line-height:15px;
text-decoration:underline;
}
.whitetext{
font-family: arial;
font-size: 11px;
color: #FFF;
line-height:15px;
}
.whitetext a{
font-family: arial;
font-size: 11px;
color: #FFF;
line-height:15px;
}
.whitetext a:hover{
font-family: arial;
font-size: 11px;
color: #000;
line-height:15px;
}
.blacktext1{
font-family: verdana;
font-size: 12px;
color: #000000;
line-height:15px;
}
 
index page source
=============
<!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>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /></head></meta></html>
<META NAME="keywords" CONTENT="Business Development Initiative, BDI, business management consultancy, executive business consultancy">
<title>Your Strategic Business Partner</title>
<link href="css/styles.css" rel="stylesheet" type="text/css" />
<style type="text/css">
<!--
body {
background-color: #666666;
margin-left: 0px;
margin-top: 0px;
margin-right: 0px;
}
.SubMenuBox1 {
position:absolute;
width:150px;
border:1px solid #000;
background:#F5FBE6;
visibility:hidden;
left: 225px;
top: 195px;
background-color: #F4F4F4;
}

</style>
<script language="javascript">
function getRealLeft(el){
xPos = document.getElementById(el).offsetLeft;
tempEl = document.getElementById(el).offsetParent;
while (tempEl != null) {
xPos += tempEl.offsetLeft;
tempEl = tempEl.offsetParent;
}
return xPos;
}

function getRealTop(el){
yPos = document.getElementById(el).offsetTop;
tempEl = document.getElementById(el).offsetParent;
while (tempEl != null) {
yPos += tempEl.offsetTop;
tempEl = tempEl.offsetParent;
}
return yPos;
}
function ShowMenu( num ) {
if( document.getElementById( "Box"+num ).style.visibility != "visible" ) {
document.getElementById( "Box"+num ).style.top = getRealTop( "MenuBox"+num )+10;
document.getElementById( "Box"+num ).style.left = getRealLeft( "MenuBox"+num )+83;
document.getElementById( "Box"+num ).style.visibility = "visible";
}

}

function HideMenu( num ) {
document.getElementById( "Box" + num ).style.visibility = 'hidden';
}
</script>
<link href="css/styles.css" rel="stylesheet" type="text/css" />
<style type="text/css">

.style1 {color: #A3C350}
.style2 {color: #999999}
-->
</style>
</head>
</meta>
<body>
<table width="767" align="center" cellpadding="0" cellspacing="0" bgcolor="#FFFFFF" style="border:1px solid #e6e6e6">
<tr>
<td width="173" height="639" valign="top" bgcolor="#a3c350"><table width="100%" cellspacing="0" cellpadding="0">
<tr>
<td valign="top"><div align="center"><img src="images/bdi logo white txt.gif" width="58" height="66" /></div></td>
</tr>
<tr>
<td valign="top"><table width="100%" cellpadding="0" cellspacing="0" bgcolor="#a3c350">
<tr>
<td>&nbsp;</td>
</tr>
<tr>
<td><table width="80%" align="center" cellpadding="0" cellspacing="0">
<tr>
<td><img src="images/menu1.gif" width="123" height="23" usemap="#Map" /></td>
</tr>
<tr>
<td><img src="images/mnu2.gif" width="123" height="23" usemap="#Map2" /></td>
</tr>
<tr>
<td><div id="MenuBox2"><img src="images/menu3.gif" width="123" height="23" usemap="#Map3" /></div></td>
</tr>
<tr>
<td><img src="images/menu4.gif" width="123" height="23" usemap="#Map4" /></td>
</tr>
<tr>
<td><img src="images/menu5.gif" width="123" height="23" usemap="#Map5" /></td>
</tr>
<tr>
<td><img src="images/menu6.gif" width="123" height="23" usemap="#Map6" /></td>
</tr>
<tr>
<td><img src="images/menu7.gif" width="123" height="23" usemap="#Map7" /></td>
</tr>
</table></td>
</tr>
<tr>
<td bgcolor="#A3C350"><p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p></td>
</tr>
</table></td>
</tr>
<tr>
<td valign="top" bgcolor="#63803B" class="whitetext" style="padding:12px"><strong>BDI Business Development Initiative Limited,<br />
Unit 6 Brechin Business Centre, <br />
10 Southesk Street, Brechin DD9 6DY <br />
<br />
Tel.: 01356 626608 <br />
Fax: 01356 629377 <br />
<br />
E-Mail : <a href="mailto:info@bdinitiative.co.uk">info@bdinitiative.co.uk</a><a href="mailto:info@bdilimited.com"></a></strong></td>
</tr>
</table></td>
<td width="594" valign="top"><table width="100%" cellspacing="0" cellpadding="0">
<tr>
<td><table width="100%" cellspacing="0" cellpadding="0">
<tr>
<td valign="top"><img src="images/img.gif" width="127" height="269" /><img src="images/img1.gif" width="117" height="269" /><img src="images/img2.gif" width="115" height="269" /><img src="images/img3.gif" width="97" height="269" /><img src="images/img4.gif" width="102" height="269" /></td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
</table></td>
</tr>
<tr>
<td valign="top" background="../BDI web files/images/bg.gif"><img src="../BDI web files/images/bg.gif" width="16" height="31" /><img src="images/wel_txt.gif" width="450" height="30" /></td>
</tr>
<tr>
<td valign="top"><table width="96%" align="center" cellpadding="0" cellspacing="0">
<tr>
<td width="42%" rowspan="2" align="center" valign="top"><img src="images/wel_img.gif" width="217" height="116" /></td>
<td width="58%">&nbsp;</td>
</tr>
<tr>
<td style="padding-right:5px; padding-left:5px"><p class="blacktext" align="justify">We offer business solutions to the Dundee and Angus Business Community.<br />
<span class="txt style1">BDI Business Development Initiative Limited </span> is constantly striving to maintain and improve the service we provide to all of our Clients Businesses and Customers.<br />
</p> <div align="right"><a href="about.html">More</a></div></td>
</tr>
<tr>
<td colspan="2" align="center" valign="top" background="../BDI web files/images/bg_bar.gif"><img src="../BDI web files/images/bg_bar.gif" width="3" height="7" /></td>
</tr>
</table></td>
</tr>
<tr>
<td valign="top"><br />
<table width="96%" align="center" cellpadding="0" cellspacing="0">
<tr>
<td width="64%"><img src="images/servic_txt.gif" width="113" height="36" /></td>
<td width="36%" rowspan="2"><img src="images/cat_img.gif" width="180" height="131" /></td>
</tr>
<tr>
<td class="blacktext"><ul>
<li><strong><a href="sales.html">Sales representation</a><br />
</strong></li>
<li><strong><a href="market.html">Market Research and Database Profiling</a> <br />
</strong></li>
<li><strong><a href="business.html">Business Consultancy</a> </strong></li>
<li><strong><a href="project.html">Project Consultancy </a><br />
</strong></li>
<li><strong><a href="retainer.html">Retainer Consultancy</a> </strong></li>
</ul></td>
</tr>
</table>
<p align="right" class="style2">&copy; BDI Business Development Initiative Limited 2007 </p></td>
</tr>
<tr>
<td valign="top">&nbsp;</td>
</tr>
</table></td>
</tr>
</table>

<map name="Map" id="Map"><area shape="rect" coords="20,2,69,19" href="index.html" />
</map>
<map name="Map2" id="Map2"><area shape="rect" coords="22,1,92,23" href="about.html" />
</map>
<map name="Map3" id="Map3">
<area shape="rect" coords="19,4,88,23" href="services.html" onmouseover="javascript:ShowMenu( 2 );" onmouseout="javascript:HideMenu( 2 );"/>
</map>
<map name="Map4" id="Map4"><area shape="rect" coords="22,1,120,23" href="testimonial.html" />
</map>
<map name="Map5" id="Map5"><area shape="rect" coords="22,4,105,25" href="future.html" />
</map>
<map name="Map6" id="Map6">
<area shape="rect" coords="23,3,110,24" href="links.html" />
</map>
<map name="Map7" id="Map7"><area shape="rect" coords="23,1,99,34" href="contact.html" />
</map>
<div align="left" id = "Box2" class="SubMenuBox1" onmouseover="javascript:ShowMenu( 2 );" onmouseout="javascript:HideMenu( 2 );">
<table width="100%" cellpadding="3" cellspacing="0" class="txt">
<tr>
<td class="txt" style="border-bottom:1px solid #666666; padding-left:12px"><a href="../BDI web files/sales.html">Sales Representation</a></td>
</tr>
<tr>
<td class="txt" style="border-bottom:1px solid #666666; padding-left:12px"><a href="../BDI web files/market.html">Market R & D Profiling</a></td>
</tr>
<tr>
<td class="txt" style="border-bottom:1px solid #666666; padding-left:12px"><a href="../BDI web files/business.html">Business Consultancy </a></td>
</tr>
<tr>
<td class="txt" style="border-bottom:1px solid #666666; padding-left:12px"><a href="../BDI web files/project.html">Project Consultancy</a></td>
</tr>
<tr>
<td class="txt" style="padding-left:12px" ><a href="../BDI web files/retainer.html" >Retainer Consultancy</a></td>
</tr>
</table>
</div>
</body>
</html>

website address is http://www.bdinitiative.co.uk
 
The 'MenuBox2' entry is missing in your stylesheet.
Should look like:
#MenuBox2{LEFT: 155px; WIDTH:180px; POSITION: absolute; TOP: 131px}
You need to figure out the correct coordinates, the above is just a sample.
 
looks like coordinates are wrong
pix is good for IE % sometimes works better
java scripting can be a pain
check other pages looks like diff logo that works with those existing numbers
you may want to try a flash pull down menu
if your site can handle the code
 
FYI: next time you have a problem, please don't bother posting all the source text, anybody can see that in his/her browser by clicking 'View/Page Source'.
 
RealBlackStuff said:
FYI: next time you have a problem, please don't bother posting all the source text, anybody can see that in his/her browser by clicking 'View/Page Source'.
Click to expand...

no probs, won't do it again
 
close out or minimize toolbars. Bear in mind not all web-pages are universally compliant. Some may force you to use IE7 to display correctly.
 
Status
Not open for further replies.

Similar threads

D
Mark Zuckerberg meets with Nvidia CEO Jensen Huang, calls him the "Taylor Swift of Tech"
Replies
6
Views
177
ZedRM
ZedRM
D
Mark Zuckerberg says the Meta Quest 3 is a "better product" than Apple Vision Pro... period
Replies
20
Views
371
Gastec
Gastec
midian182
Elon Musk jet-tracking account banned from Twitter arrives on Threads with request for...
Replies
3
Views
329
RandomWAN
R

Latest posts

Back