troubleshooting Question

Div positions itself on the left of IE, but the right in Firefox?

Avatar of dmullis
dmullisFlag for United States of America asked on
Fonts TypographyCSS
12 Comments1 Solution388 ViewsLast Modified:
Please look at this page in IE and Firefox:

 http:www.quickprobusinesswebsites.com

You are looking for the orange word "FLASH!" to appear, for only 3 seconds that was programed in Javascript.
In IE the word comes from the far left and Firefox from the middle of the page.

Right now I have no positioning listed in the CSS  as you can see IE and Firefox are so off now with only HTML and Javascript. I have tried padding with no margin, margin with no padding, moving the DIV itself every where, using position absolute with top and left.
1.)How can I control the position of this DIV period in any browser - mainly problems with the TOP padding, margin, etc
2.) How can I make the position of this div similar in both browsers - it is WAY off.
Here is the code:

External CSS and Javascript:

<style type="text/css">
   /*<![CDATA[*/

#flash{
font-family:Verdana;
position:absolute;
font-weight:bold;
color:#FFC275;
}

/*]]>*/
    </style>

<script language="JavaScript" type="text/JavaScript">

//This script created by Steve Bomer (steveb03@yahoo.com)
//Modified by Deidre Mullis

//Change the message below
var themessage="FLASH!"
var fontsize=10
//Below determines how long the message will appear before disappearing. 3000=3 seconds
var appearfor=2000

function position_at_top()
{
if (document.layers)
document.flash.top=pageYOffset
else if (document.all)
{
flash.innerHTML='<div><font face="Verdana">'+themessage+'</font></div>'
setTimeout("flash.style.top=document.body.scrollTop+10;flash.style.left=document.body.scrollLeft+10",100)
}
else if (document.getElementById){
document.getElementById("flash").innerHTML='<div><font face="Verdana">'+themessage+'</font></div>'
document.getElementById("flash").style.top=pageYOffset
}
}

function expand()
{
if (document.layers){
document.flash.document.write('<div  style="font-size:'+fontsize+'px"><font face="Verdana">'+themessage+'</font></div>')
document.flash.document.close()
}
else if (document.all)
flash.style.fontSize=fontsize+'px'
else if (document.getElementById)
document.getElementById("flash").style.fontSize=fontsize+'px'
fontsize+=5
if (fontsize>90){
if (document.layers)
setTimeout("document.flash.visibility='hide'",appearfor)
else if (document.all)
setTimeout("flash.style.visibility='hidden'",appearfor)
else if (document.getElementById)
setTimeout("document.getElementById('flash').style.visibility='hidden'",appearfor)
return
}
else
setTimeout("expand()",50)
}

</script>

_________________________________________________________________________________________

HTML:

<body onload="position_at_top();expand();">

<div id="flash"></div>

</body>















ASKER CERTIFIED SOLUTION
Join our community to see this answer!
Unlock 1 Answer and 12 Comments.
Start Free Trial
Learn from the best

Network and collaborate with thousands of CTOs, CISOs, and IT Pros rooting for you and your success.

Andrew Hancock - VMware vExpert
See if this solution works for you by signing up for a 7 day free trial.
Unlock 1 Answer and 12 Comments.
Try for 7 days

”The time we save is the biggest benefit of E-E to our team. What could take multiple guys 2 hours or more each to find is accessed in around 15 minutes on Experts Exchange.

-Mike Kapnisakis, Warner Bros