html - div コンテナ内に 2 つの div を収めようとしています

Question

コンテナー内に 2 つの div を配置しようとしていますが、位置が非常に奇妙です。

<div id="headernav">
                <div id="logo"></div>
                <nav id="navbar"></nav>
 </div>

nav を 700px のような特定の幅にし、ロゴ div を残りのスペースに合わせたいので、100% にします。

#headernav{
    background:#0000FF;
    height: 60px;
}
#logo{
    height:100%;
    width: 100%;
    background:red;
    height:100%;
}
#navbar{
    width:700px;
    height:100%;
    background: cyan;
}

Answer 1

calc(100% - 700px);ロゴを試すwidth

https://developer.mozilla.org/en-US/docs/CSS/calc

これを見てください。クロムで正常に動作します。

http://jsfiddle.net/btevfik/W5stS/