Pau*_*aul 5 css width css-float
我想在页面左侧有一个容器（带有一些文本），它可以根据可用空间进行调整，右侧有 2 个侧边栏（我正在使用 Wordpress）。（2 个侧边栏与float.配合良好。）所以我尝试width:auto了容器。
但它不会适应剩余的可用空间（它占用所有页面宽度）。如果我将宽度设置为70%，它适合索引页上的空间，但如果我点击一篇文章，我只剩下 1 个侧边栏，所以文本和侧边栏之间有一个空白空间。
你知道如何解决这个问题吗？
#container { /* the text */
overflow:auto;
width:auto;
position:relative;
float:left;
}
#primary { /* first sidebar */
position:relative;
border:1px solid red;
float:right;
width:250px;
}
#second { /* second sidebar */
border:1px solid red;
background:white;
width:250px;
height:auto;
float:right;
margin-left:15px;
}
谢谢
编辑 ：
假设我正在使用它而不是 wordpress 侧边栏：我仍然无法使其工作，有人可以看看这个简单的代码吗？有两个盒子：绿色一个和红色一个...
<!DOCTYPE>
<html>
<head>
<meta charset="UTF-8" />
</head>
<body>
<div style="position:relative; width:700px; margin:0 auto;">
<div style="width:auto; border:1px solid green;">i would like to have a container (with some text) on the left of the page, that adapts itself with the space available, and 2 sidebars following on the right (i'm using Wordpress). (The 2 sidebars work fine with float. ) So i tried width:auto on the container.
But it does not adapt itself with the rest of the space available (it takes all the page width). If i set the width to 70%, it fits the space on the index page, but if i click on an article, i only have 1 sidebar left, so there is a blank space between the text and the sidebar.</div>
<div style="width:20%; float:right; border:1px solid red;">blablabla</div>
</div>
</body>
</html>