divのグリッドを作成する最も良い方法は？

Question

私はプレイしているオンラインブラウザゲーム用の友達リストスクリプトを作っています。私はラッパーの中に必要な4つのdivを持っています：1）友達のリスト、2）友達の追加、3）友達リクエスト、4）チャット。私は最初の2つを取得する方法を考え出したが、私は残りの部分を追加する助言が必要です。ここで私はこれまで、どのような私が追加したい持っているものです。

右側にある2つのdiv要素を追加するための最良の方法だろうか？私は4つの部門のテーブルを作るべきでしょうか？

2つのdivのための私のCSSはこのようなものになり、両方：誰もが私に私はそれを非常に感謝し、このセットアップを達成するための良い方法に洞察力を与えることができれば

position: relative; 
    width: 40%; 
    height: 70%; 
    top: 5%; 
    left: 2%; 
    border: 1px solid blue; 

を。ここでは私がこれまで持っている基本的なアウトラインのフィドルです：https://jsfiddle.net/kfupd6hb/1/

Answer 1

あなたはfloat：left; CSSの属性。 私はurフィドルを更新しました.. どういうわけかコメントのリンクを提供する理由はここにリンクを作成することができません。

Answer 2

私はdisplay:inline-block;を使用して<div>を並べて表示することをお勧めします。そのプロパティで本当に完璧なグリッドを作ることができます。