在响应式设计中，`inline-block` 和 `float: left` 都是用于布局的常见方式，但它们的表现和适用场景有所不同。

1. **display: inline-block**
- 元素水平排列，且元素之间的空白（white space）会被忽略。
- 每个元素都会独占一行，除非它们的宽度总和超过父元素的宽度。
- 可以通过设置 `vertical-align` 属性来调整元素的垂直对齐方式。
- 可以设置 `width` 和 `height` 属性来定义元素的大小。
- 不具有浮动属性，因此不会影响其他非浮动元素的布局。
- 通常用于需要保持元素水平排列，且每个元素都需要指定宽度和高度的场景。

2. **float: left**
- 元素向左浮动，直到它的左边缘碰到包含框的左边缘或者遇到另一个浮动元素。
- 浮动元素会脱离文档流，这意味着它们不会影响非浮动元素的布局。
- 可以通过设置 `clear` 属性来清除浮动的影响。
- 浮动元素的宽度通常由包含框的宽度决定，除非设置了 `width` 属性。
- 多个浮动元素可以并排显示，直到行满，然后新的一行从左边缘开始。
- 通常用于创建布局中的浮动区域，如侧边栏或创建多列布局。

在响应式设计中，`inline-block` 通常更易于使用，因为它不会像 `float` 那样影响文档流，并且可以更好地适应不同的屏幕尺寸。此外，`inline-block` 元素的宽度可以自动适应其内容，而 `float` 元素的宽度通常需要手动设置。

然而，`float` 也有其用途，比如在需要创建复杂的布局时，或者需要将元素浮动到一边以避免被其他内容覆盖的情况下。

总结来说，`inline-block` 适合于响应式设计中需要元素水平排列且宽度固定的情况，而 `float` 则适合于需要创建浮动区域或分栏布局的情况。在实际应用中，通常会结合使用两者来达到最佳的布局效果。