CSS div 宽度计算：width、padding、border 影响分析

分析以下代码：

div {
  width: 100px;
  padding: 3px 5px;
  border: solid 5px red;
  float: left;
}

根据代码中的样式属性，分析以下每个属性的作用：

1. width: 100px;：设置 div 元素的宽度为 100 像素。
2. padding: 3px 5px;：设置 div 元素的内边距为上下 3 像素，左右 5 像素。这意味着内容距离 div 元素的边界会有 3 像素的间距。
3. border: solid 5px red;：设置 div 元素的边框样式为红色实线，宽度为 5 像素。
4. float: left;：设置 div 元素向左浮动。这意味着其他元素可以紧贴其右侧。

根据这些样式属性，实际宽度计算如下：

1. width 属性设置了 div 元素的宽度为 100 像素。
2. padding 属性设置了内边距，会在宽度的基础上增加内边距的宽度。上下各 3 像素的内边距和左右各 5 像素的内边距，会增加宽度 6 像素和 10 像素。
3. border 属性设置了边框宽度为 5 像素，会在宽度的基础上增加边框的宽度。边框宽度为 5 像素，会增加宽度 10 像素。
4. float 属性设置了元素向左浮动，不会影响实际宽度。

因此，最终 div 元素的实际宽度为 100 + 10 + 6 = 116 像素。