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
Post a Comment