Google material design lite : grid distribution

Question

Using google material lite, I want 1 larger div with 4 smaller div in a 2x2 format like this:

My initial thought was to house everything in one mdl-grid. Then create two mdl-grids, and, in the second column, create two rows and two columns to create the 1x1 and 2x2 effect.

However, this doesn't seem to be possible, or I am just not doing it correctly?

<div class="mdl-grid">
    <div class="mdl-grid">
        <div>image</div>
    </div>
    <div class="mdl-grid">
        <div class="mdl-grid">
            <div>1</div>
            <div>2</div>
        </div>
        <div class="mdl-grid">
            <div>3</div>
            <div>4</div>
        </div>
    </div>

 </div>

EDIT 1 : Adding cell sizes upon first comment

<div class="mdl-grid">
    <div class="mdl-grid">
        <div class="mdl-cell mdl-cell--6-col">image</div>
    </div>
    <div class="mdl-grid">
        <div class="mdl-grid">
            <div class="mdl-cell mdl-cell--6-col">1</div>
            <div class="mdl-cell mdl-cell--6-col">2</div>
        </div>
        <div class="mdl-grid">
            <div class="mdl-cell mdl-cell--6-col">3</div>
            <div class="mdl-cell mdl-cell--6-col">4</div>
        </div>
</div>

Answer 1

You have missed mdl-cell--12-col inside mdl-grid :

<div class="mdl-grid">
   <div class="mdl-cell mdl-cell--6-col bg-sky">
     image
   </div>
   <div class="mdl-cell mdl-cell--6-col">
      <div class="mdl-grid mdl-grid--no-spacing">
          <div class="mdl-cell mdl-cell--12-col">
              <div class="mdl-grid">
                  <div class="mdl-cell mdl-cell--6-col bg-sky">1</div>
                  <div class="mdl-cell mdl-cell--6-col bg-sky">2</div>
              </div>
              <div class="mdl-grid">
                 <div class="mdl-cell mdl-cell--6-col bg-sky mdl-col--stretch">3</div>
                 <div class="mdl-cell mdl-cell--6-col bg-sky mdl-col--stretch">4</div>
             </div>
         </div>
      </div>
   </div>
</div>

Each mdl-grid should have mdl-cell, if it is a one row then put mdl-cell--12-col.

See my codepen : Codepen Demo