html - 使div填充所有剩余/可用宽度

的CSS

#floatright_a {
    background-color: #c0c0c0;
    float: right;
}
#floatright_b {
    background-color: #ffc0ff;
    float: right;
}
#floatright_c {
    background-color: #c0ffc0;
    /*float: right;*/
}

的HTML

<div id="floatright_a">A</div>
<div id="floatright_b">B</div>
<div id="floatright_c">C</div>

小提琴

https://jsfiddle.net/0ty3o56u/

给定上面的示例，C如何将所有剩余的可用空间移到左侧？

最佳答案

#floatright_a {
    background-color: #c0c0c0;
    position:absolute;
    right:0;
    z-index:1;
    right:10px;
}
#floatright_b {
    background-color: #ffc0ff;
    position:absolute;
    right:0;
    z-index:1;
}
#floatright_c {
    background-color: #c0ffc0;
    float: right;
    width:100%;
    position:relative;
    z-index:0;
}

<div id="floatright_c">C</div>
<div id="floatright_a">A</div>
<div id="floatright_b">B</div>

通过定位，您可以将元素放置在彼此的顶部，这样就可以使元素C填充整个屏幕，并在其顶部放置元素a和b。可悲的是，我没有办法给div分配一个流体宽度，稍后可能会再回来。

关于html - 使div填充所有剩余/可用宽度，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/28791730/