css宽度为2个div的百分比，最小宽度为一个div

Question

嗨我在包装器中有2个div元素：

<div id="wrapper">
    <div id="widgets" class="sidebar-left"></div>
    <div id="content" class="content-right"></div>
</div>

我必须说我使用了wordpress响应主题，并且两个内部div元素显示为左浮动sidebar-left和浮动content-right右侧。

这是示例.css代码：

使用此代码，当您缩小浏览器窗口时，它们始终具有相同的水平宽度百分比。

整个过程从@media (min-width: 650px)

开始

我希望sidbar-left保持14％的宽度，从最初的650px开始，只有content-right调整为缩小浏览器窗口。

因为我使用Wordpress“响应式”主题它只能使用它们两个元素的宽度达到14％+ 82％所以我需要一些东西，如果你减少你的content-right宽度浏览器窗口大小。

Answer 1

所以你需要一个固定宽度的侧边栏左边和一个流体宽度内容 - 右边，右边？

.sidebar-left {
    width: 91px; /* 14% of 650px */
    float:left;
}
.content-right {
    margin-left: 101px; /* leave 10px space */
}