Html 如何将浮动子div扩展到具有其他同级的父div

我正在使用HTML DIVs动态创建HTML表视图。由DIV创建的单元也应该是可扩展的，因为在不久的将来，我还需要实现拖放功能

为此，我创建了一个布局，如下所示，代码可在

有8个div单元以浮动方式排列，以获得12.5%的宽度，在这里，任何div都可以增加到20-25行，并且在没有任何卷轴的情况下，它们的高度也会增加。而其他div的行数将更少

我的问题是--我想在渲染单元之间显示1px的边界（如下面的屏幕截图所示），但是所有div都没有扩展到100%，所以我如何管理它

所以总结是,

1) I need to extend DIV and whole row of that DIV if content of the cell(DIV) is increased, 
2) I need border at left and bottom , 
3) I don't want to use table, or display: table, table-cell

---

如果你死板反对显示：表，表格单元格，你会考虑使用FrasBox吗？strong>注意：Flexbox在IE9中不受支持，在不同的浏览器中可能会表现得有点怪异。确保彻底测试

div{
字体系列：Verdana、Arial、Helvetica、无衬线；
字体大小：11px；
}
.cg假日主管，
.cg日期信息头{
溢出：隐藏；
显示：-webkit flex；
显示：-ms flexbox；
显示器：flex；
-webkit柔性包装：包装；
-ms-flex-wrap:wrap；
柔性包装：包装；
}
.cg信息单元，
.cg日历单元格{
宽度：12.5%；
浮动：左；
填充物：3px 5px；
溢出：隐藏；
}
*,
*：之前，
*：之后{
-moz框大小：边框框；
-webkit框大小：边框框；
框大小：边框框；
}
.cg假期{
背景色：#1B7EAD；
颜色：白色；
文本对齐：居中；
填充：2px；
边框：1px实心#8CBBD6；
}
.cg病人头{
背景色：#29A5E3；
颜色：白色；
填充物：5px；
右边框：1px实心#ADE1F8；
}
.cg日期信息{
填充物：5px；
背景色：#E7F7FF；
弹性：1；
}
.cg周末日{
背景色：#86CFF0；
}
.cg行集装箱{
边框底部：2个实心#68BFE8；
最小高度：30px；
/*显示：表格*/
溢出：自动；
显示：-webkit flex；
显示：-ms flexbox；
显示器：flex；
-webkit柔性包装：包装；
-ms-flex-wrap:wrap；
柔性包装：包装；
}
.cg行容器.cg信息单元格，
.cg行容器.cg日历单元格{
右边框：1px纯黑；
}
.cg日历单元格：最后一个子项{
边界权：无；
}
.cg行容器：第n个类型（偶数）{
背景色：#ebf7ff；
}
.cg集装箱{
身高：100%；
溢出y：滚动；
}
.cg单元边界{
位置：绝对位置；
顶部：0px；
底部：0px；
保证金：1px 0 1px-2px；
边框：1px实心浅灰色；
}
/*-----------------------CSS浏览器黑客-----------------------------*/
/*铬黑*/
.cg假日头：非（*：根），
.cg日期信息头：非（*：根）{
/*左边距：17px*/
/*现在不需要黑客*/
}
/*结束铬黑客*/
/*CSS浏览器黑客行为结束*/

假期！！！
度假2
病人
星期日-3/19
星期一-3/20
星期二-3/21
星期三-3/22
星期四-3/23
星期五-3/24
星期六-3/25
芬利，安吉拉

（387）
地位
假期
缺席
参观
参观
参观
参观
在职
地位
假期
缺席
参观
在职
地位
假期
缺席
参观
在职
地位
假期
缺席
参观
在职
地位
假期
缺席
参观
在职
地位
假期
缺席
参观
在职
地位
假期
缺席
参观
在职
艾拉·斯坦顿

（132）
地位
假期
缺席
参观
在职
地位
假期
缺席
参观
在职
地位
假期
缺席
参观
在职
地位
假期
缺席
参观
在职
在职
在职
在职
地位
假期
缺席
参观
在职
地位
假期
缺席
参观
在职
地位
假期
缺席
参观
在职

但在其他浏览器中工作非常出色。。。你摇滚（我投票）。。。请在IE9中帮助我->不幸的是，IE9不支持flexbox。在这种情况下，建议使用display:table和display:table单元格。我将更新我的答案以反映这一点。