动态地将子div添加到父div不会使父div增长以容纳子div

时间:2012-03-03 09:44:36

标签: javascript html

我在主页上有一个div:

<div id="Alerts" class="Alerts"><a class="handle" href=""></a></div>  

我在运行时使用其他div填充此div:

function CreateDivIncident(errorcode, name, address, lat, lng) {  
var div = CreateDefaultDiv('Alerts');  
var html = errorcode + '</b> Name:' + name + ' Address: ' + address;  
div.innerHTML = html;  
google.maps.event.addDomListener(div, 'mouseover', function () { div.style.backgroundColor = '#55FFFF'; });  
google.maps.event.addDomListener(div, 'mouseout', function () { div.style.backgroundColor = 'white'; });  
google.maps.event.addDomListener(div, 'mouseup', function () { gmap.panTo(new google.maps.LatLng(lat, lng)); });  
}

function CreateDefaultDiv(parent) {  
var div = document.createElement('div');  
div.style.marginBottom = '5px';  
div.style.backgroundColor = 'white';  
div.style.border = 'solid 1px';  
div.style.fontSize = "16px";  
div.style.fontFamily = "Arial";  
div.style.paddingRight = "5px";  
document.getElementById(parent).appendChild(div);  
return div;  
}

新的div正在显示并充分发挥作用,但是父div没有相应地增加其高度。新的div只是“漂浮”在它上面。

我在这里缺少什么?欢迎任何建议。

1 个答案:

答案 0 :(得分:1)

float:left.Alerts上写下#Alerts css规则。父容器将采用高度和宽度。通过在父div和子div上使用border:1px solid red;进行测试,我的意思是哪个元素在外面,哪个元素在里面。通过识别边界。

更新:删除高度110px;