Css 是否可以将一行中的div向上推以填充上一行的空白？

我有一个布局问题，总结在图片中。 实际上，我有两行包含span4 div。问题是第一行的一个div太高，它决定了行的高度。在第二行中，我有一个小div，如果它可以填充上面一行的空白就好了。有css3技巧可以做到这一点吗

请看一下图片。我在这里添加了一个JSFIDLE：

html来自菜单的动态构造，基于CMS中存储的项目，所以我没有太多的控制权

---

唯一的方法是使用包含a和d的包含div

下面是一个JSFIDLE链接：

如果无法控制HTML，可以使用jquery添加cont2div

要通过jquery实现这一点，您可以执行以下操作

$( "#a, #d" ).wrapAll( "<div class='cont2'></div>" );

<div class"cont">
<div class="cont2">
    <div id="a">A</div>
    <div id="d">D</div>
</div>

<div id="b">B</div>
<div id="c">C</div>

.cont {
overflow:auto;
border:1px solid #ccc;
}

.cont2, #a, #b, #c {
float:left;
background-color:grey;
width:30px;
}
#a, #b, #c{
background-color:green; 
height:30px;
}
#c {
background-color:red;
height:60px;
}

$( "#a, #d" ).wrapAll( "<div class='cont2'></div>" );