html - appending DIV comes vertically -


in below code, progressdiv div getting build up. getting build vertically... need horizontally... shud ?

    var progressdiv = document.getelementbyid('progressdiv')     var div = document.createelement('div');      div.style.display = 'block';     div.style.cssfloat = 'left';     div.style.width = '10px';     div.style.height = '10px';     div.style.backgroundcolor = 'red';     div.style.border = '1px solid black';      progressdiv.appendchild(div);     if (progressdiv.childnodes.length == 20)         while (progressdiv.haschildnodes())             progressdiv.removechild(progressdiv.firstchild); 

ah, old ie. if make div span, set style inline-block, , drop float, should work:

var progressdiv = document.getelementbyid('progressdiv'); var span = document.createelement('span');  span.style.display = 'inline-block'; span.style.width = '10px'; span.style.height = '10px'; span.style.backgroundcolor = 'red'; span.style.border = '1px solid black';  progressdiv.appendchild(span); if (progressdiv.childnodes.length == 20) {     while (progressdiv.haschildnodes()) {         progressdiv.removechild(progressdiv.firstchild);     } } 

why span rather div? because ie doesn't try inline elements block default, if change display. it's fine making default-inline elements blocky.

don't know if dropping float mess else you're trying do, though. if you're trying progress bar, should fine provided keep progressdiv wide enough.


Comments

Popular posts from this blog

c++ - Convert big endian to little endian when reading from a binary file -

C#: Application without a window or taskbar item (background app) that can still use Console.WriteLine() -

unicode - Are email addresses allowed to contain non-alphanumeric characters? -