楼主，你仔细看看你父元素wrapper的高度为多少？这是为什么呢？因为你yellow左浮动了，脱离文档流，red绝对定位也已经脱离文档流了，所以你red定位在bottom：80px没什么屌用，因为父元素高度都没有，它上哪去找80px的底部来定位。
所以，你要解决的方法就是，动用你勤劳的小手，给父元素wrapper加上overflow:hidden;(溢出隐藏)

.red {
                width: 300px;
                position: absolute;
                text-align: center;
                bottom: 80px;
                z-index: 9999;
                background-color: red;
            }
            改成：
            .red {
                width: 300px;
                position: absolute;
                text-align: center;
                top: 0;
                z-index: 9999;
                background-color: red;
            }