CSS避免padding属性影响元素宽度，造成溢出换行

最近在写Time for插件缩略图排列的时候，由于padding属性总是影响盒子大小，导致默认写好的参数在不同宽度场景下存在溢出换行的情况，或者是填不满盒子。

如图

解决办法

在要控制元素排列的外层标签上添加 box-sizing: border-box;属性，进而不让padding影响盒子大小。

定义和用法

box-sizing 属性允许您以特定的方式定义匹配某个区域的特定元素。

例如，假如您需要并排放置两个带边框的框，可通过将 box-sizing 设置为 “border-box”。这可令浏览器呈现出带有指定宽度和高度的框，并把边框和内边距放入框中。

默认值： content-box
继承性： no
版本： CSS3
JavaScript 语法： object.style.boxSizing=”border-box”