Posts em grid

Olá!

Eu estou tentando fazer um layout de postagem em que o primeiro ocupa a largura de 100%. Os demais são dispostos em grid, dois posts.

(Vou anexar uma imagem para exemplificar o que desejo).

Segue o código:

.post:first-child{width:100%;position:relative;}
.post{margin-bottom:60px;width:48.8%;float:left;background:#eee}
.post:nth-child(2n+2){margin-right:30px;}

<div  id='mainwrapper'>

<div class="post">
  <div class="post-entry">
       1 Post com width 100%. Here goes my post.
  </div>
</div>

<div class="post">
  <div class="post-entry">
       2. Post com width 48%. Here goes my post.
  </div>
</div>

<div class="post">
  <div class="post-entry">
       3. Post com width 48%. Here goes my post.
  </div>
</div>

  </div><!-- mainwrapper-->

	Esse código que fiz não me satisfez por completo porque o post da direita não "gruda" no canto, então está ficando desigual o primeiro e os demais.

	 

	Eu gostaria de saber se não existe uma forma mais prática de fazer esse código.

	Obrigada!