我敢肯定这一定很明显,但我有点卡在这里了。 我想构建一个工具,我需要一个工具箱和一个工作区。 所以我想将工具箱定位为左侧的固定宽度(比如 250 像素),并让工作区使用屏幕中剩余的可用空间。
我尝试过同时使用 DIV 和 TABLE,但是工作区一直在工具箱下方移动,因为它变大了(这样两个部分就不会固定在一起)
我怎样才能让工作区做到这一点?
这是 HTML:
<div id="container" style="width: 100%">
<div id="toolbox" style="width: 250px">
</div>
<div id="workspace"> <!-- this keeps jumping to the next line -->
</div>
</div>
最佳答案
你需要 float 你的工具箱:
#toolbox {
float: left;
width: 250px;
}
/* also you should contain the floated element */
#container:after {
content: ' ';
display: block;
clear: both;
}
另外,不要给 #workspace
一个宽度或 float ,它会在你的工具箱和容器的剩余宽度之间滑动。
关于html - 如何设置混合宽度容器(px 和 %)?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/20255334/