右侧的Div键填写所有可用空间 [英] Make Div on right side fill out all available space

问题描述

我想在旁边创建两个div，但是我想要左边的一个是300px，右边一个占用屏幕上的剩余量。这怎么可能？谢谢！

I want to create two divs beside each other, however I want the one on the left side to be 300px, and the right one to take up the remaining amount on the screen. How would that be possible? Thanks!

推荐答案

最简单的方法是使用 ：table ：

#wrapper {
    display: table;
    width: 100%;
}
#left, #right {
    display: table-cell;
    color: white;
}
#left {
    background: blue;
    width: 300px;
}
#right {
    background: red;
}

<section id="wrapper">
    <aside id="left">Left 300px</aside>
    <div id="right">Right the rest</div>
</section>

http://jsfiddle.net/YbLZE/1/

尝试调整右下角的大小。

Try resizing the bottom right frame.

更新为 HTML5 元素部分和 aside ，如果您有 HTML5 doctype ，您应该使用它。我必须记住使用那些...

Updated with HTML5 elements section and aside, which you should use if you have an HTML5 doctype. I have to remember to use those...

这篇关于右侧的Div键填写所有可用空间的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！