css html网页错位原因解决方法

错位一 3错位零落凋落与1与2下方

错位二 网页机关错位树范

造成DIV CSS网页机关错位的缘由可以有两种状况，一种是宽度计算差迟，一种是IE BUG形成，格外是IE6与IE7。往后我们挨着为人人介绍错位与妄想错位方法。

宽度计算错误，要是总宽度为500px，有3个盒子，别离css宽度为200px、200px、100px，这个没问题可能在一排闪现不会错位，但如果问鼎了css边框、padding、margin属性时，别健忘这几个属性所占的宽度。分外是padding与边框border占用宽度空间不要疏忽了。如果有一个盒子参预左右侧框，这个时候有一个盒子中刚适宜的宽度前提下削减2px边框占用宽度，否则即会总3个盒子计算宽度大于了总宽度，形成错位。

宽度题目构成CSS布局错位小结：
内盒子宽度之与大于了外宽度造成错位，搜查时辰咱们一定计算配置宽度、边框、paddind、margin之和。

这个题目是最思空见贯的标题，我们查抄完第一点宽度标题问题，而宽度没题目，这个时候在IE6、IE7中错位，在IE8及此外阅读器没有错位问题，这个时刻我们就要思量到你可否运用了margin属性，通常咱们应用了CSS浮动（css float）环境下应用margin（margin-right margin-left这里分外是这个属性）此属性会发生发火双倍数值，这个时刻我们须要使用css hack希图此标题问题。让IE6或IE7零丁识别特指定margin名堂。

如：
1、IE6零丁识别（margin-left对付只要IE6错位状况下）
{margin-left:5px;_margin-left:2px}
这个时候除IE6外其他涉猎器设别margin-left:5px，IE6径自辨认_margin-left:2px

2、IE7与IE6都识别（margin-left对于ie6与ie7辨认其它版本和品牌涉猎器不设别）
{margin-left:5px;*margin-left:2px;}
这个时候除IE6与IE7外，其他涉猎器设别margin-left:5px，IE6和IE7识别*margin-left:2px