div width=auto 与 width = 100% 区别

块级元素（div、p等）的初始宽度是auto。auto使块级元素占满父节点在水平方向上的所有可用空间。

具体公式如下：

‘margin-left'+border-left-width'+'padding-left'+'width'+'padding-right'+'border-right-width'+'margin-right' = width of containing block

请参考网页标准： block-level, non-replaced
elements in normal flow

只要块级元素使用样式：width=auto.就不用担心当自身有margin、padding 、border 时，宽度会超过父节点

样式width=100%,块级元素的外盒尺寸宽度将是父节点的宽度+自身在水平方向上的margin、padding、border。这样就会发生内容溢出父节点的情况，这可能是你想要的，单大多数时候，这不是你想要的

在css3样式中，使用box-size 可以破解width=100%带来的问题，但是由于pc端兼容性的问题，还不建议使用，不过可以先学习下

参考：http://www.456bereastreet.com/archive/201112/the_difference_between_widthauto_and_width100/