我目前正在尝试专门定位多个div,在另一个div中,它本身在另一个div中.
要了解我正在尝试做的事情:
我有一个具有特定高度和宽度的父div.在div元素内部应该是另一个div(白色边框),它是居中的.同样,在div内部应该是一些特定位置(绿色)的div.应该创建绿色div并通过javascript函数追加.
我现在希望中心div的高度和宽度动态变化,当我把我的绿色div放在里面.
我目前的代码是:
HTML:
CSS:
#grandparent{
height: 130px;
width: 145px;
background-color: #000000;
border: 3px solid #00ffff;
display: table;
}
#parent{
display: table-cell;
vertical-align: middle;
}
.child{
height: 23px;
width: 23px;
float: left;
}
JavaScript的:
for(var i = 0; i < number; i++){
var top = ...
var left = ...
var child = $("
到目前为止,我的内容基于本指南:
http://www.vanseodesign.com/css/vertical-centering/
最佳答案
如果我理解你不需要任何JS将div放在里面只使用inline-block:
#parent{
display: table-cell;
vertical-align: middle;
text-align:center; /*Add this*/
}
.child{
height: 23px;
width: 23px;
/*float: left; Remove this*/
display:inline-block; /*Add this*/
}
编辑
根据您的图片,您可能需要额外的div:
原文链接:https://www.f2er.com/html/426020.html