[英]appending DIV comes vertically
In the below code, progressDiv is the DIV which is getting build up. 在下面的代码中,progressDiv是要建立的DIV。 But it is getting build up vertically... i need it horizontally... What shud i do ? 但是它正在垂直堆积...我水平需要它...我应该做什么?
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, good old IE. 嗯,好旧的IE。 If you make the div
a span
, set the style to inline-block
, and drop the float, it should work: 如果将div
设置为span
,则将样式设置为inline-block
,并删除浮点数,它应该可以工作:
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 a span
rather than a div
? 为什么是span
而不是div
? Because IE doesn't like you to try to inline elements that are block by default, even if you change their display
. 因为IE不希望您尝试插入默认情况下被阻止的元素,即使您更改了它们的display
。 But it's fine with making default-inline elements blocky. 但是将默认内联元素设置为块状就可以了。
Don't know if dropping the float will mess up something else you're trying to do, though. 不过,不知道放下浮标是否会弄乱您要尝试做的其他事情。 But if you're just trying to do a progress bar, it should be fine provided you keep the progressDiv
wide enough. 但是,如果您只是想做一个进度条,那么只要将progressDiv
保持足够宽就可以了。
div.style.display = 'inline'
为我工作。
div.style.cssFloat = 'left';
should be div.style.float = 'left';
应该是div.style.float = 'left';
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.