HTML CSS DIV 面板

I want to make something like this:

到目前为止我所做的：

谁能告诉我如何实现这一目标...

谢谢！提前...

See jsFiddle http://jsfiddle.net/SanaBukhari/DAFW9/

代码如下：

HTML:

<div class="panel panel1">Panel 1x</div>
<div class="panel panel1">Panel 1x</div>
<br>
<div class="panel panel2">Panel 2x</div>

CSS:

body {
    background: #eeeeee;
}
.panel {
    display: inline-block;
    background: #ffffff;
    min-height: 100px;
    height: 100px;
    box-shadow:0px 0px 5px 5px #C9C9C9;
    -webkit-box-shadow:2px 2px 5px 5x #C9C9C9;
    -moz-box-shadow:2px 2px 5px 5px #C9C9C9;
    margin: 10px;
    padding: 10px;
}
.panel1 {
    min-width: 100px;
    width: 100px;
}
.panel2 {
    min-width: 245px;
    width: 245px;
}

See: jsFiddle http://jsfiddle.net/faisalawanlive/DAFW9/18/

希望你能解决这个问题：

body {
  background: #eeeeee;
}
.panel {
  display: inline-block;
  background: #ffffff;
  min-height: 100px;
  height: 100px;
  margin: 10px;
  padding: 10px;
}
.panel1 {
  min-width: 100px;
  width: 100px;
  height: 120px;
  margin-bottom: 0;
  box-shadow: 0;
}
.panel2 {
  min-width: 100px;
  width: 100px;
}
.panel3 {
  min-width: 245px;
  width: 245px;
  margin-top: 0px;
}

<div class="panel panel1">Panel 1x</div>
<div class="panel panel2">Panel 1x</div>
<br>
<div class="panel panel3">Panel 2x</div>