Html 将左右浮动对齐到父div的底部

我在HTML页面中有一个包含子元素的元素

<div id="parent">
    <div class="child01"></div>
    <div class="child01"></div>
    <div class="child02"></div>
</div>

我有一个关于当前css的例子

我想知道如何让子div与父div的底部对齐（不使用我在网上找到的绝对位置答案，如果可能的话，我想保留float属性）

---

我曾尝试在表中使用verticle align:bottom和positioning元素（有效），但它们不适用于向父div动态添加更多子元素。选项1：您可以在这些子元素周围添加一个包装器，该包装器绝对定位。

然后，您可以继续在包装器中使用浮动

/*外观*/
#母公司{
宽度：80%；
保证金：0自动；
高度：100px；
背景色：#BBBBBB；
位置：相对位置；
}
.包装纸{
溢出：隐藏；
位置：绝对位置；
底部：0；
宽度：100%；
背景：浅蓝色；
}
.child01{
宽度：70px；
高度：70像素；
背景色：#888888；
}
.child02{
宽度：50px；
高度：30px；
背景色：#888888；
}
/*定位*/
.child01{
右边距：20px；
浮动：左；
}
.child02{
浮动：对；
}

---

这可能是一个没有学校像旧学校那样的例子

我已经设法用我想要避免的桌子做到了这一点（但没有绝对定位那么多）

---

我希望有一个类似的解决方案，能够动态添加与现有定位一致的元素

位置：绝对有什么问题？我很确定，如果您希望这样做并以简单的方式保持响应，那么您必须在父元素上使用

位置：相对

，然后使用

位置：绝对；底部：0在子..绝对位置将不起作用，因为元素将动态添加，并且将全部堆叠在彼此的顶部。这些元素很接近，但不会起作用，因为只有容器与底部对齐，子元素未与底部对齐。啊，您的问题不清楚。那你就不能使用浮动了…这是个问题吗？
<!-- parent is now a table -->
<table id="parent" cellpadding="0" cellspacing="0" border="0">

<!-- table row handles bottom alignment -->
<tr valign="bottom">