Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 4 of 4
  1. #1
    New Coder
    Join Date
    Sep 2006
    Posts
    59
    Thanks
    0
    Thanked 0 Times in 0 Posts

    FireFox vs IE, styles problem

    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,
    Q


    Code:
    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>";
    	results_div.appendChild(sd);
    }

  • #2
    Supreme Master coder! _Aerospace_Eng_'s Avatar
    Join Date
    Dec 2004
    Location
    In a place far, far away...
    Posts
    19,291
    Thanks
    2
    Thanked 1,043 Times in 1,019 Posts
    You can't have multiple style attributes. Try this
    Code:
    	sd.innerHTML = "<div style=\"top:"+tps+";width:1220px;height:50px;background-color:green;border:1px solid white;\">testing testing</div>";
    ||||If you are getting paid to do a job, don't ask for help on it!||||

  • #3
    Banned
    Join Date
    Oct 2005
    Location
    I'm in GMT -5
    Posts
    314
    Thanks
    0
    Thanked 1 Time in 1 Post
    -----

  • #4
    New Coder
    Join Date
    Sep 2006
    Posts
    59
    Thanks
    0
    Thanked 0 Times in 0 Posts
    as always Aero to the rescue! Thanks so much. One day I hope to help you out.

    Q


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •