Inline-block 和 float:left 是 CSS 中两种不同的布局方式，它们在响应式设计中的表现存在以下差异：

1. 方向性：
- float:left 通常用于创建浮动元素，它会使元素向左浮动，直到其外边缘碰到包含框或另一个浮动元素的右侧为止。如果需要，你还可以使用 float:right 来使元素向右浮动。
- inline-block 元素会像内联元素一样排列，但是它们可以设置宽度和高度，并且可以容纳块级内容。在水平方向上，inline-block 元素会一个接一个地排列，直到它们遇到一个设置了 clear 属性的元素或者容器边缘。

2. 定位：
- float:left 会使元素脱离文档流，这意味着它不会影响周围元素的布局，除非其他元素也浮动。浮动元素会形成一个新的层叠上下文。
- inline-block 元素仍然在文档流中，因此它们会像普通的内联元素一样影响周围元素的布局。

3. 清除浮动：
- 如果使用 float:left，你可能需要清除浮动，以防止后续的块级元素被浮动元素“挤出”。这通常通过在后续元素上设置 clear:both 来实现。
- inline-block 元素不需要清除浮动，因为它们不会像块级元素那样被浮动元素影响。

4. 垂直对齐：
- float:left 通常不提供对元素垂直对齐的控制，除非结合使用其他属性，如 margin、padding 或定位属性。
- inline-block 元素可以通过设置 vertical-align 属性来控制其垂直对齐方式。

5. 响应式设计：
- 在响应式设计中，float:left 通常用于创建布局网格，例如在移动设备上显示为两列，在大屏幕上显示为三列。通过调整浮动元素的宽度，可以很容易地实现响应式布局。
- inline-block 也可以用于响应式设计，尤其是在需要元素水平排列并且保持响应性的时候。通过调整 inline-block 元素的宽度，可以在不同屏幕尺寸下保持布局的灵活性。

6. 浏览器兼容性：
- float:left 在所有现代浏览器中都有很好的支持。
- inline-block 在一些旧版本浏览器中可能需要前缀（如 -webkit-inline-block 在旧版 Safari 中），但这种情况现在已经很少见了。

总结来说，float:left 和 inline-block 都是布局元素的有效方式，但它们在响应式设计中的表现和应用场景有所不同。选择哪种方式取决于你的具体设计需求、元素的特性以及你希望达到的效果。