0

我有一个包含一些输入的div 。div 的内容是可变的，但是使用背景颜色检查，我如何扩展周围 div 的高度和宽度以包围输入。

我的样本位于：http: //jsfiddle.net/fallenreaper/pL6Ua/

目标是如果宽度调整，那么所有的框都会向下移动。

我试过这样的事情： 

position: relative;

但它并没有完全包裹周围的 div。我错过了什么？

编辑： javascript 用于我正在开发的扩展工具。屏幕上显示的项目是：

$alt_item

Edit2： div 的内容是动态的，所以我需要能够将所有内容向下推以适应。从本质上讲，它看起来应该类似于：如果将 *$("#dtr_list > div")* 高度设置为 80px。

我正在考虑使用 Javascript 作为选项，找到所有孩子中最大的（高度 + 顶部），然后将高度 = 设置为那个。

编辑3：

var maxH = 0;
$($("#dtr_list > div")[0]).children().each(function(){
    $("#altdata").append("Top: "+$(this).position().top + " Height: "+ $(this).height()+ "<br />");
    if(($(this).position().top + $(this).height()- $(this).parent().position().top+5) > maxH)
    {
        maxH = $(this).position().top + $(this).height() - $(this).parent().position().top + 5;
    }
});
$("#altdata").append("maxH: "+maxH);
$("#dtr_list > div").css("height", maxH);

这个 javascript 将解决它，但我不喜欢我需要以编程方式完成它。我添加的+5是因为边距，但您可以将 +5 作为硬编码数字替换为：

Number($(this).parent().css("margin").match(/^\d/))
4

0 回答 0