为什么要估计长度
估算网页像素长度的目的是为了让CSS网页布局整齐、兼容。 通常，我们在布局左右结构网页或者使用padding和margin布局时，都会估计整个页面的长度。 如果不估计长度，无论长度太大还是太小css 宽度计算，都会出现不对中的问题。
如何估计 CSS 长度
示例1：我们估计左右结构的布局风格。
如果总长度是400px，左右要大于400px，那么我们可能左边有300px，右边有100px
正确代码：
复制代码代码如下：
右 300 像素
向右 100 像素
以上是左右结构的正确总长正好等于400px
错误：
如果我们保持总长度不变，右侧为300px，右侧为120px，那么总长度超过20pxcss 宽度计算，我们看看会出现什么问题，DIV+CSS代码如下：
复制代码代码如下：
右 300 像素
向右 100 像素
根据上图，我们可以看到总长度约为20px，因此左右结构无法对齐，左侧掉落。
这样就出现了错位兼容性的问题。 通常情况下，由于我们在实践中估算的疏漏，差异较小时通常为1px-2px，以至于我们不会注意到。 因此，我们可以从长度估计开始，以消除不对中兼容性。
示例2：左右结构中有1px边框实例
通常左右结构都有1px的边框，有些边框是后来添加的。 当我们设置左右结构的时候，我们需要把这个边框的长度和左右结构的长度一起估计出来。
正确的反例：
CSS和html代码如下：
复制代码代码如下：
右 300 像素
向右 100 像素
因为左右结构的长度都是1px，所以分别需要除以左右2个像素的边框长度，所以最终左侧长度为298px，右侧长度为98px
如果不按边界划分，会导致以下效果：
DIV+CSS设置比例长度估算
有时我们也需要用比率来估计长度，一般总比率长度不能超过100%
估计CSS长度时要注意摘要：
无论是左右结构、多列布局、还是单个DIV长度布局设置，都需要注意长度的掌握和估算，尤其是在使用padding、margin、border等CSS属性时。 这时，我们需要将它们设置为包含长度估计，并牢牢掌握同一行的长度之和大于或等于总长度。 如果小于总长度，就会出现错位的兼容性问题。 所以通常当出现错位时我们可以从估计长度开始。 事实上，造成失准的原因有很多。 这也是解决错位兼容性问题的方法之一。
