View Full Version : FireFox vs IE, styles problem

10-23-2006, 08:06 PM
Hello all,
I've been working with these dynamically created div elements to append to a static div that I preposition on the page. The code below is intended to create ten 1220pixel X 40pixel green squares that appear one on top of the other (vertically, so you can see all 10) with a white border, and with the text "testing testing" on each square.
I see this behavior exactly when i view my page on Internet Explorer. (it works) However, on firefox (latest version), I only see the text "testing testing", (no green, no border, no appropriate spacing) ten times on the screen.
I have tried to tackle this problem using many different techniques, but I think this may have to do with the differences inherently between the way firefox and IE process styles. It is more important to me to get this working on FireFox than IE as most people viewing this page will be using FF. I have posted the relevant code below. If anyone has posted this before, I apologize, but my search of these forums was unrewarded.

Thanks in advance for your time and advice,

var results_div = document.getElementById("results_div");
for(var i =0; i< 10 ; i++)
var sd = document.createElement("div");
var tp= 40*i;
var tps = tp+"px";
sd.innerHTML = "<div style=\"top:"+tps+"\"style=\"width:1220px\" style=\"height:50px\" style=\"background-color:green\" style=\"border:1px solid white\">testing testing</div>";

10-23-2006, 08:33 PM
You can't have multiple style attributes. Try this

sd.innerHTML = "<div style=\"top:"+tps+";width:1220px;height:50px;background-color:green;border:1px solid white;\">testing testing</div>";

10-23-2006, 08:33 PM

10-23-2006, 08:53 PM
as always Aero to the rescue! Thanks so much. One day I hope to help you out.