css - 阻止 body 进入固定菜单

Question

当我调整页面大小时，我的正文内容会转到固定菜单区域。

我正在使用像素和百分比，我该如何防止这种情况发生？

http://jsfiddle.net/D6ZCh/

<div class="menu">menu</div>
<div class="body">body content</div>

.menu{
    height: 100%;
    position: fixed;
    background-color: red;
    width: 200px;
    float: left;
}

.body{
    background-color: yellow;
    float: right;
    width: 60%;
}

Answer 1

你可以在 .body 上使用 width: calc(100% - 200px);

例子: jsFiddle

ps: 仅限现代浏览器