我发现，设置两列显示:table-cell;代替float: left;工作得很好。

给予位置:绝对;对我的孩子有效

对我有效的是添加 style={{display: 'flex'， overflowY: "auto"}} 给所有孩子的父母，然后 style={{overflowY: "auto"}} 对孩子本身。

2021年的读者:

试试这个:

.parent {
  position: relative;

  display: flex;                 // And you will probably need this too.
  flex-direction: row;           // or column.
}

.child {
  position: absolute;
  top: 0;
  bottom: 0;

  align-self: center;            // And you will probably need this too.
}

以下是我正在做的事情:

对于父节点:

display: flex;

您应该添加一些前缀，例如http://css-tricks.com/using-flexbox/。

正如@Adam Garner所指出的，align-items:拉伸;不需要。它的用法也适用于父母，而不是孩子。如果你想定义儿童拉伸，你使用align-self。

.parent { 背景:红色; 填充:10 px; 显示:flex; ｝ .other-child { 宽度:100 px; 背景:黄色; 身高:150 px; 填充:.5rem; ｝ .child { 宽度:100 px; 背景:蓝色; ｝ < div class = "父" > < div class = "另一个孩子“> 仅用于拉伸父节点 < / div > < div class = "孩子" > < / div > < / div >

#main {
    overflow: hidden;
}
#navigation, #content {
    margin-bottom: -1000px;
    padding-bottom: 1000px;
}