SOURCE

<span class='tall bottom'></span>
<span class='short'></span>
<span class='tall top'></span>
<span class='short'></span>
<div class='wrap'>
<div class='half'></div><!--
--><div class='half'></div>  
<div>

.tall,.short{
  display:inline-block;
}
.tall{
  height:100px;
  width:50px;
  background:#ccc;
}
 .bottom{
 vertical-align:text-bottom; 
} 
.short{
  height:10px;
  width:60px;
  background:red;
}
.top{
  vertical-align:text-top;
}
.wrap{
  width:100%;
}
.half{
  display:inline-block;
  width:50%;
  height:100px;
  background:#ccc;
}