可以通过设置 border-sizing：border-box
我更喜欢用border-box，因为border-box更灵活一点，举个例子，我在业务中遇到一个问题，我的商品详情页的一个盒子是高度自适应的，为146px，但是在ie8浏览器上显示为146.8px，如何解决，如果对盒子设置height:146px则会出现被撑高的情况，因为box-sizing默认为content-box，你给元素设置宽高，只是给元素内容设置宽高，你元素的总高度是heigtht + border + padding所以就会出现撑高，解决方法就是给当前的盒子设置box-sizing: border-box这样你设置高度为146px时，会默然将元素内容的高度进行相应减少来保证整体高度为146px，这个最大的好处就是你这个盒子有好几个，而且有不同的padding和border值，解决这个的最好的方法就是给盒子设置border-box
溢出就是你设置的样式表现出来的东西超出了你的本意，比如一个盒子里面的内容本来应该包含在盒子里面，但是它不小心超出了范围，从盒子里面延伸出去了，破坏了页面的美观，所以用溢出隐藏把多余的部分隐藏掉。css代码：
.box {width:200pxheight:30pxline-height:30pxbackground-color:#cdd/*overflow:hidden*/ }
html代码：
<div class="box">我溢出了我溢出了我溢出了我溢出了你能把我怎么样</div>
你可以看看加了overflow:hidden和不加这句的区别
朋友，overflow具体如何定义溢出内容，要看你给定的值来具体处理。
overflow：visible，这个就是默认值。内容不会被修剪，会呈现在元素框之外。
overflow：hidden，这个值代表的是内容会被修剪，并且其余内容是不可见的。
overflow：scroll，这个值代表内容会被修剪，但是浏览器会显示滚动条以便查看其余的内容。
overflow：auto，这个代表如果内容被修剪，则浏览器会显示滚动条以便查看其余的内容。
overflow：inherit，这个代表规定应该从父元素继承 overflow 属性的值。
这些值才是overflow处理溢出内容的关键，根据需求设置不同的值即可。
