一个简单的两栏布局下，为另一栏预留的width需要比实际宽度大的问题

Question

html结构：<div id="left"></div> <div id="right"></div>css代码：* {    box-sizing: border-box; }#left, #right {    display: inline-block;    vertical-align: top; }#left {    width: calc(100% - 205px);      /* don't know why additional 5px? */}#right {    width: 200px; }demo：https://codepen.io/anon/pen/N...一个简单的两栏布局，使用calc()动态计算左边栏的width来为右边栏预留空间。按照我的理解，#right是200px，中间没有其他内容，左栏width应该calc(100% - 200px)就足够了，但是实际测试发现，右栏会被挤到下一行，而至少需要calc(100% - 205px)才能保证两栏在同一水平线，多出来的5px在哪里被占据了？在chrome、IE11测试均如此