html - 显示 CSS : some divs fixed, 一些灵活的 (2)

Question

不知何故，我在这方面很糟糕，所以我需要你们的帮助。该问题与我之前的问题类似(可在此处找到:Display CSS: some divs fixed, some flexible)。

这次我需要#DIV-3 是灵活的，随着窗口高度的变化而变小和变大，并且所有其他 DIVS 都需要固定。所以这是一个例子:

谁能像上次一样帮我拉一把 fiddle 。非常感谢。

这是代码示例，但可能并不重要:

#DIV-1{
position: fixed;
padding: 1em 2em;
top: 6.8em;
right: 0;
height: 9.5em;
width: 18%;
bottom: 75%;
}

#DIV-2{
position: fixed;
padding: 1em 2em;
width: 18%;
top: 16em;
bottom: 18em;
right: 0;
}

#DIV-3{
position: fixed;
padding: 1em 2em;
bottom: 0em;
right: 0;
width: 18%;
height: 18em;
overflow-y: auto;
}

Answer 1

我认为这可能是你想要的(使用你的另一个问题的答案)......虽然哈哈，但构建东西的可怕方式。

http://jsfiddle.net/uKPEn/5/

.middle1 {
    background: blue;
    height: 100px;
    top:50px;
}
.middle2 {
    background: green;
    top: 150px;
    height: 100px;
}
.logo {
    background: pink;
    overflow: scroll;
    top: 250px;
    bottom:0%;
}

不太确定，但你可以考虑使用类似 Isotope 的东西或 Masonry用于构建像这样组合在一起的东西。