レスポンシブに並べたい

Question

cssの質問です。

divタグで括ったboxの中に、横並びのコンテンツがあります,ブラウザの幅を狭めたりしたときにデザインが崩れてしまうのですが、ブラウザを小さくしても縦になったり、そのコンテンツの大きさにあったboxにするためにはどうすればよいのでしょうか？

Answer 1

こちら↓のサイトを参考にしてみるとどうでしょうか。
これからのCSSレイアウトはFlexboxで決まり！

Answer 2

Bootstrapを使うという手もあります。
ドットインストールのBootstrap入門を一度見ると、簡単に使えることが分かると思います。

Answer 3

横並びコンテンツをfloatで作っているなら、各ボックスのwidthを%で指定すれば
同じ比率を保った状態で伸縮させることができます。
その際、ボックス同士の間に余白（margin）があるなら、そのmarginも%で指定します。
最終的に子要素全てのwidthとmarginの%を足して100%を超えないようにきちんと計算しておけば
カラム落ちは防げます。
固定サイズ→％単位サイズへの変換を手動で行うのであれば

親要素のcontent-box横幅（px）÷対象となるサイズ（px）×100

という計算式を覚えておきましょう。width, margin, paddingはこれで行けます。

計算式を覚えるのも自分で計算するのも面倒ならば、上の方もおっしゃっているように
Bootstrapなどの既存のフレームワークを利用すると良いかと思います。
デザインにこだわりがないのであればそれが簡単です。