Html 放置子div始终位于父div的底部

我正在尝试设计一个html布局，其中子div应始终位于父div的底部。默认情况下，父div的高度应为100%。请为我提供同样的解决方案

链接：

HTML:

---

类为“Bottom”的div应始终位于类为“Content”的div的底部，其中其他div是固定的

如果将

.wrapper

设置为100%高度，则

.Content

也将是高度的100%，而

.bottom

将位于此分区的底部。这可能不是您想要的行为，但它是您问题的答案（我们没有关于整个内容应该如何工作/展开/滚动/与内容对齐的信息）

如果您将

.wrapper

设置为100%高度，

.content

也将是高度的100%，而

.bottom

将位于此分区的底部。这可能不是您想要的行为，但这是您问题的答案（我们没有关于整个内容应该如何工作/展开/滚动/与内容对齐的信息）

您所寻求的与“粘滞页脚”技术。谷歌和阅读此应用于您的案例您所寻求的类似于“粘滞页脚”技术。谷歌和阅读此应用于您的案例

<div class="wrapper">
  <div class="header"></div>
  <div class="left">menu</div>
  <div class="content">
    Lorem ipsum dolor sit amet, consectetur adipiscing...
    <div class="bottom">index</div>
  </div>
</div>

html, body {
height: 100%;
padding:0
margin:0;
}

.header {
 background: #4a90e2;
 height: 100px;
 position: fixed;
 width:100%;

 }


.left {

position: fixed;
height: 100%;
top: 100px;
background: #F44336;
width: 20%;

}

.content {

position: relative;
height: 100%;
top: 100px;
left: 20%;
background: #555;
width: 80%;
color:#fff;
min-height: 100%;
}

.bottom {
position: absolute;
bottom: 0px;
background: yellow;

}