css - 当子 div 不能并排放置时，让 div 清晰？

Question

我正在制作一个响应式网站。我有 3 个 div (.block)，我需要将它们水平放置在一起。

当屏幕足够宽时，这很容易实现。但是，当我使浏览器更窄时，第三个 div (3) 换行到下一行，但我想要的是所有 div.blocks 换行到下一行。

这可以在没有媒体查询的情况下完成吗？如果元素的宽度是动态的，我希望 CSS 能够继续工作。

http://codepen.io/anon/pen/KeulD

<div class="other-block">
  Other block
</div>

<div class="cont1">
  <div class="block">1</div>
  <div class="block">2</div>
  <div class="block">3</div>
</div>
.cont {
  width: 25%;
}
.block {
  float: left;
  border: 1px solid green;
  width: 70px;
  height: 70px;
}
.other-block {
  height: 70px;
  width: 300px;
  border: 1px solid red;
  float: left;
}

Answer 1

float .cont1 怎么样:

.cont1 {
  float:left;
}

Codepen demo