如何在清除后显示与其他图像齐平的图像？

Question

我在这里包含了一个屏幕截图，介绍了我目前拥有的内容以及我希望如何修复它：http://i.imgur.com/urAI4UF.png

下面是我的项目的简化HTML代码(我在一个复杂的网格中构建了19个图像，所以我只包括麻烦的图像，因为其他的图片都在一起玩得很好)：

<div class="wrapper">
    <div class="images">
        <div class="col col-1-3">
            <div class="module" id="img-10">
                <img src="img/pic_10.png">
            </div>
        </div>
        <div class="col col-1-3 clear">
            <div class="module" id="img-11">
                <img src="img/pic_11.png">
            </div>
        </div>
        <div class="col col-1-3">
            <div class="module" id="img-12">
                <img src="img/pic_12.png">
            </div>
        </div>
        <div class="col col-1-3">
            <div class="module" id="img-13">
                <img src="img/pic_13.png">
            </div>
        </div>
    </div><!--.images -->
</div><!--.wrapper -->  

Img 11有一个清晰，所以它会把自己放在图像10下，但是我不能让img 12和13与图像10同步。如果我不在img-11上做清除，它将与img-10并排。

这是我的CSS：

* { 
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing:border-box:
}
.wrapper {
    width: 1000px;
    margin:0 auto;
}
.grid {
    overflow: hidden;
}
    .col{
        float: left;
    }
    .col-1-5 {
        width: 20%;
    }
    .col-1-3 {
        width: 33.3333%;
    }
    .col-2-5 {
        width: 40%;
    }
    .col-2-3 {
        width: 66.6666%;
    }
    .col-3-5 {
        width: 60%;
    }
.module img {
    width: 100%;
    height: 100%;
    padding: 3px;
}
#img-10 {
    height: 194px;
    width: 333.33px;
}
#img-11 {
    height: 194px;
    width: 333.33px;
}
#img-12,
#img-13 {
    height: 388px;
    width: 333.33px;
}
.clear {
    clear: both;
}      

更新:我在另一个站点上得到了朋友的帮助，而使用这段代码却很有效：

<div class="col col-1-3">
    <div class="module" id="img-10">
        <img src="img/pic_10.png">
    </div>
    <div class="module" id="img-11">
        <img src="img/pic_11.png">
    </div>
</div> 

Answer 1

更新:我在另一个站点上得到了朋友的帮助，而使用这段代码却很有效：

<div class="col col-1-3">
    <div class="module" id="img-10">
       <img src="img/pic_10.png">
    </div>
    <div class="module" id="img-11">
        <img src="img/pic_11.png">
    </div>
</div>